什么是BFC，BFC解决哪些问题

一.什么是BFC

        定义：翻译为块级格式化上下文，它会创建一个只有块级盒子参与布局的不受外界布局影响的特殊区域。

        如何定义一个BFC：

        1.开启浮动，2.绝对定位，3.display：inline-block，4.overflow值不为visible的块元素（hidden，auto，scroll）

        BFC的性质：

        1.内部的box将独占宽度，且在垂直方向一个接一个排列

        2.box在垂直方向上的间距由margin属性决定。（会发生外边距折叠，不会出现外边距穿透）

        3.每个box在水平方向上的左边缘与BFC的左边缘相对齐，即使存在浮动也是如此

        4.BFC区域不会与浮动元素重叠，而是会依次排列

        5.BFC是一个独立的渲染容器，不受外界布局任何干扰

        6.浮动元素的高度也参与BFC的高度计算

二.BFC解决哪些问题

        文字环绕、浮动时的高度坍塌、外边距折叠和外边距穿透都可用BFC来解决