本文简单聊聊BFC(块级格式化上下文)

1. 啥叫块级格式化上下文？
具体指代的就是一个容器（如div等），这种容器具备的特性：

  • 内部元素的任何样式改动，都不会影响到容器外的元素。
  • 内部的浮动元素的高度也会计算在内
  • margin重叠

2. 触发场景

  1. html根元素。毕竟他外头啥都没有。
  2. 浮动元素
  3. overflow不为visible
  4. position为absolute或者fixed

3. 应用场景

  1. 防止margin重叠。
    同一个BFC的元素标签内会出现margin重叠。因此BFC隔离开即可解决。
  2. 高度包含浮动元素。
  3. 不与浮动元素重叠