bfc

bfc:块级格式化上下文 ，是一个有特殊功能的容器

解析bfc区域的规则（特殊功能）：
1、bfc内部元素从上往下排列，一个挨着一个
2、元素的左外边距挨着bfc区域的左边框
3、垂直摆放的元素边距由margin决定，同属于同一个bfc区域的元素垂直margin会合并
4、bfc区域和float元素不会重叠（特殊情况position）
5、bfc就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素
6、计算bfc的高度时，浮动元素也参与计算

bfc触发规则：
1、html（根元素）是最大的bfc区域
2、position为absolute、fixed
3、display为

inline-block
table-cell
table-caption
flex
inline-flex

4、overflow不为visible
5、float不为none

bfc应用：

1、两列布局，三列布局
2、清除高度塌陷
3、使垂直方向的外边距不合并（父子关系）