什么是BFC？怎么触发BFC？BFC应用在哪？

BFC是什么？

（Block formatting context）块级格式上下文
它是一个独立的渲染区域，只有Block-level box 参与，就像一个大的容器，里面装的东西不管如何折腾都出不了这个容器。

怎么触发BFC？

注意：根元素 HTML默认 就是一个BFC
1，float属性不为none
2，position 为 absolute 或 fixed
3，display 为 inline-block，table-cell，table-caption，flex，inline-flex
4，overflow 不为 visible

BFC应用在哪？

1，自适应两栏布局（BFC的区域不会与float box 发生重叠）
2，清除内部浮动（计算BFC的高度时，浮动元素也参与计算）
3，防止 margin 上下重叠（box 垂直方向的距离由 margin 决定，属于同一个BFC的两个相邻box的margin会发生重叠）