定义
块级格式化上下文
特性
1、内部box在垂直方向，一个接一个放置
2、box垂直方向的间距由margin决定
属于同一个BFC的相邻box的margin会发生重叠（外边距重叠）
解决方法：给父元素加overflow：hidden，并把其中一个子元素放进另一个box中
3、每个子元素的margin-left与包含块的左边（父元素且有相对定位和boeder-left）相接触（对于从左往右的格式化，否则相反）浮动也一样
即margin-left和border-left相挨着
4、BFC区域不会与任何浮动元素（float box）发生重叠
触发条件中的（2、4、5）可解决重叠问题
可实现自适应两栏布局
一个给宽且固定并左浮动，一个不给宽但用overflow：hidden/auto/scroll或者用display：flex，超出页面用overflow：hidden隐藏
5、独立的区域，且容器内的子元素不会影响到容器之外的元素，反之也一样
6、计算BFC高度时，浮动元素也会参与计算（默认下，浮动元素不参与计算）
可解决高度塌陷
触发条件
1、根元素 html
2、float属性值不为none时
3、position为absolute或者fixed时
4、display为inline-block、table-cell、table-caption、flex、inline-flex时
5、overflow不为visible时
只要满足以上任何一条，都会触发BFC，且是父元素触发