css进阶-5.3块级格式化上下文（BFC）

块级格式化上下文（BFC：Block Formatting Context）

1. 作用：BFC是一块独立的渲染区域，他规定了在该区域中，常规流块盒的布局。

2. 常规流块盒的特点（牢记于心，牢记于心）：
   - 常规流块盒在水平方向上，必须撑满包含块。
   - 常规流块盒在包含块的垂直方向上依次摆放。
   - 常规流块盒若外边距无缝相邻，则进行外边距合并。
   - 常规流块盒的自动高度和摆放位置，无视浮动元素。

3. BFC的渲染区域：
   BFC的渲染区域由某个html元素创建，以下元素会在其内部创建BFC区域：
   - 根元素，意味着 < html >元素创建的BFC区域覆盖了网页中所有的元素
   - 浮动和绝对定位元素
   - overflow ！= visible的块盒

4. BFC是独立的，每个不同的BFC区域，它们进行渲染时互不干扰。创建BFC的元素，隔绝了它内部和外部的联系，内部的渲染不会影响到外部。

5. 创建BFC的元素的具体规则（牢记于心，牢记于心）：
   - 高度要计算浮动元素
   - 边框盒不会与浮动元素重叠
   - 不会和它的子元素进行外边距合并（不同的BFC，外边距会合并）