BFC

块级格式化上下文

条件

根元素 (html)
浮动元素
position 为绝对定位元素（absolute/fixed）
display: inline-block、inline-flex等
overflow: auto/scroll/hidden (overflow 值不为 visible 或 clip 的块级元素)

特点

BFC 内部元素不影响外部元素
计算高度需要计算浮动元素
BFC 区域不会与浮动容器发生重叠
在 BFC 中上下相邻的俩个容器的 margin 会重叠
每个元素的左 margin 值和容器的左 border 相接触

作用

清除浮动带来的高度塌陷问题
解决俩个元素的 margin 重叠问题
创建自适应的俩栏布局