bfc带来的布局规则变化
开启bfc特性：display:flow-root;
.bfc-container {
display: flow-root;
}
默认开启bfc：
- 1、html会默认开启bfc
- 2、float不为none的元素也会开启bfc
- 3、overflow不为visible开启bfc
bfc特性有
- 1、包含内部浮动
- 2、排除外部浮动（开启bfc的元素会阻止自己的文字去环绕相临近的浮动元素）
- 3、阻止外边距margin重叠（margin重叠：当父元素的两个子元素中间没有任何有高度的元素隔离,相邻两个元素之间互相设置margin-top和margin-bottom）
- 4、处理margin塌陷(margin塌陷：当父元素没有设置padding 没有设置border 内部也没有文字的情况下，给子元素设置margin-top，会在现象上产生给父元素设置margin-top的错觉）
