利用BFC特性实现两栏自适应
有时候我们在CSS布局的时候需要实现两栏布局,且其中一栏的宽度不固定。据我的经验,有以下几种方法:
inline-block
首先两个元素不跨行,又要可以设置宽高,当然是inline-block,但是用此方法有个非常大的缺陷,就是width属性不好设置
- js计算
- 百分比计算
- calc属性
Float + overflowHidden
这种方式利用BFC特性
flex
具体看代码。
有时候我们在CSS布局的时候需要实现两栏布局,且其中一栏的宽度不固定。据我的经验,有以下几种方法:
首先两个元素不跨行,又要可以设置宽高,当然是inline-block,但是用此方法有个非常大的缺陷,就是width属性不好设置
这种方式利用BFC特性
具体看代码。