BFC

BFC（Block formatting context）, 块级格式化上下文。

BFC特性，具备BFC特性的元素，即独立的渲染区域，可看成一个区域，容器内不会影响到外面的容器。它决定了其子元素将如何定位，以及和 其他元素的关系和作用。

怎么样才能形成BFC呢？

1、float的值不能为none;

2、overflow的值不能为visible；

3、display的值为table-cell, table-caption, inline-block中的任何一个

4、position的值为absolute或者fixed

BFC的布局规则

 1、属于同一个BFC的两个相邻Box的margin会发生重叠，取较大的margin值。

2、BFC区域内的元素，块级元素仍然是块级元素，行内元素仍然是行内元素，

3、如果BFC内有浮动的元素，计算BFC的高度的时候，要包含浮动子元素的高度。

外边距重叠的解决办法

让形成外边距重叠的元素，隔离成不同的BFC。