BFC（块级格式化上下文）布局规则

1.元素垂直排列。

SRE实战 互联网时代守护先锋，助力企业售后服务体系运筹帷幄！一键直达领取阿里云限量特价优惠。

2.同一个BFC相邻两个元素的margin会重叠。

3.BFC区域不会与浮动元素重叠。

4.BFC就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素。反之也如此。

5.计算BFC的高度时，浮动元素也参与计算。

 

如何创建BFC

1.根元素

2.浮动float

3.absolute或fixed

4.overlfow部位visible

5.display为inline-block, table-cell, table-caption, flex, inline-flex

 

BFC多用来清除浮动、阻止外边距折叠、阻止元素被浮动元素覆盖（两列布局）

扫码关注我们
微信号：SRE实战
拒绝背锅 运筹帷幄