CSS样式——BFC规范

• 了解BFC规范

  BFC即Block Formatting Contexts(块级格式化上下文)。具有BFC特性的元素可以看作是隔离了的独立容器，容器里面的元素不会在布局上影响到外面的元素，并且BFC具有普通元素所没有的一些特性。

• 触发BFC规范的条件

  1. 设置浮动样式的元素：除float:none以外
  2. 设置绝对定位的元素：position（absolute、fixed）
  3. 设置元素类型转换的元素：display（inline-block、table-cells、flex）
  4. 设置元素内容溢出显示的元素：overflow（hidden、auto、scroll）

• BFC规范的应用

  1. 解决margin高度塌陷问题
  2. 解决margin-top传递问题
  3. 解决浮动问题
  4. 解决覆盖问题