BFC（块级格式化上下文，防止 margin 重叠，用于清楚浮动）

简单来说bfc就是块级格式化上下文，是一个独立的渲染区域，并且有一定的布局规则。
BFC 区域不会与 float box 重叠 BFC 是页面上的一个独立容器，子元素不会影响到外面 计算 BFC 的高度时，浮动元素也会参与计算 那些元素会生成 BFC： 根元素 float 不为 none 的元素 position 为 fixed 和 absolute 的元素 display 为
table-cell、
table-caption，
inline-block、
flex，
inline-flex 的元素 overflow 不为 visible 的元素.