BFC 块级格式化上下文 (Block Formatting Context)，是css渲染规则之一  。一个BFC盒子是独立布局的，盒子里面的子元素布局不会影响到外面的元素。在同一个 BFC 中的两个毗邻的块级盒在垂直方向（和布局方向有关系）的 margin 会发生折叠。 

触发BFC规则的方式：

• 根元素(html)
• float属性不为none
• position为absolute或fixed
• display为inline-block, table-cell, table-caption, flex, inline-flex
• overflow不为visible