什么是BFC?
CSS中的BFC是Block Formatting Context的缩写,是指一个独立的渲染区域或者独立容器。创建BFC可以使用浮动元素、绝对定位、display的值为inline-block、table-cell、table-caption、flex以及overflow除了visible以外的值(hidden,auto,scroll)等方式。

BFC的特性
BFC的特性包括:内部的盒子会在垂直方向上一个接一个的放置,垂直方向的距离是有margin决定,BFC的区域不会与float的元素区域重叠,计算BFC高度时,浮动元素也参与计算,BFC就是一个独立容器,容器里面的子元素不会影响外面的元素。
BFC的应用场景
BFC的应用场景包括:解决边距重叠问题、盒子塌陷、清除浮动和文字环绕问题等。创建BFC可以使用overflow属性,如给父盒子一个overflow:hidden属性,可以避免父盒子也会向下移动20px、遮住后面的盒子等不希望看到的情况。
作者小本本,推荐大家使用BFC解决CSS布局问题哦!
原创文章,作者:小编小本本,如若转载,请注明出处:https://www.benjiyun.com/yunzhujiyunwei/vps-yunwei/6294.html
