BFC详解

定义：在一个web页面的css渲染中，块级格式化上下文（Block Fromating Content）是按照块级盒子布局的。w3c对BFC的定义如下：浮动元素和绝对定位元素，非块级盒子的块级容器（例如：inline-blocks,table-cells,table-caption）,以及overflow值不为"visiable"的块级盒子，都会为他们的内容创建新的BFC(块级格式上下文)

创建BFC的条件：

1.float不为none

2.position不为static或者relative

3.overflow不为 visible

4.display值为inline-block,table-cell,table-caption,inline-flex,flex

BFC可以解决的问题：

1.避免外边距的折叠

2.BFC可以包含浮动(即清除浮动)

3.避免文字环绕   注意：在BFC上下文中，每个盒子的左侧紧紧贴包含块的左侧，甚至有浮动也是如此。除非盒子创建了一个新的BFC

4.在多列布局中使用BFC

详细可以参考：https://www.cnblogs.com/libin-1/p/7098468.html