块格式化上下文（block formatting context） 是页面上的一个独立的渲染区域，容器里面的子元素不会在布局上影响到外面的元素。它是决定块盒子的布局及浮动元素相互影响的一个因素。
下列情况将创建一个块格式化上下文：
- 使用float属性，值不为none。
- 使用position属性，值为absolute或fixed。
- 使用display属性，值为inline-block、table-cell、flex、grid等。
- 使用overflow属性，值不为visible。
BFC的作用
1.清除内部浮动：对子元素设置浮动后，父元素会发生高度塌陷，也就是父元素的高度变为0。解决这个问题，只需要把把父元素变成一个BFC就行了。常用的办法是给父元素设置overflow:hidden。
2.上下margin重合问题，可以通过触发BFC来解决
