什么是BFC？

MDN上的描述
块格式化上下文（Block Formatting Context，BFC） 是Web页面的可视CSS渲染的一部分，是块盒子的布局过程发生的区域，也是浮动元素与其他元素交互的区域。

触发BFC规范的元素，可以形成一个独立的容器。不受到外界的影响，从而解决一些布局问题。

FC与BFC

Formatting context(格式化上下文）是W3C CSS2.1规范中的一个概念。
它是页面中的一块渲染区域，并且有一套渲染规则，它决定了其子元素将如
何定位，以及和其他元素的关系和相互作用。

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

触发BFC的条件

浮动元素：float 除 none 以外的值
绝对定位和固定定位元素：position(absolute、fixed)
display 为 inline-block、table-cells、flex
overflow 除了 visible 以外的值（hidden、auto、scroll)

BFC的特性及应用

解决margin叠加问题
解决margin传递问题
解决浮动问题
解决覆盖问题