块级格式化上下文（BFC）

之前面试的时候问到过这个知识点，当时答得并不是很好。平时写样式的时候偶尔还是会用到的，总结一下。

含义

• BFC 即 Block Formatting Contexts (块级格式化上下文)，它属于定位方案的普通流。它是一个独立的渲染区域。
• 具有 BFC 特性的元素可以看作是隔离了的独立容器，容器里面的元素不会在布局上影响到外面的元素，并且 BFC 具有普通容器所没有的一些特性。
• 通俗一点来讲，可以把 BFC 理解为一个封闭的大箱子，箱子内部的元素无论如何翻江倒海，都不会影响到外部。BFC内部的元素和外部的元素绝对不会互相影响。

使用

触发BFC，只要满足以下任意一条件,将会触发BFC：
（1）body根元素
（2）浮动元素：float：除none以为的值
（3）绝对定位元素：position：absolute/fixed
（4）display：inline-block/table-cells/flex
（5）overflow：除了visible以外的值（hidden/auto/scroll)

常用来解决margin坍塌（垂直margin重叠）、清除内部浮动、自适应布局等问题。