在写一个移动端网页,发现网页的头部搜索框两边各有固定宽度的按钮,搜索框可以根据宽度的变化来改变自己的宽度,达到填充的目的,也就是一种自适应吧,下面写写自己尝试的几种方法
一 利用css3 的width:calc(100% - npx);
注意 width:calc(100% - 120px); 两边都有空格,不要问我为什么会知道。。。
二 利用display:table和display:table-cell;
display:table 这个属性很少用,display:table-cell可以自适应宽度,这点倒是挺好的。
三 利用position:absolute;
利用position:absolute;不固定宽度,设置高度,然后将左右定位为预留的位置,然后就会自适应屏幕宽度了。
四 关于上下自适应
这个就是利用position:absolute;上下都定位到边上,就会自适应了。。