BFC定义
BFC(Block formatting context)直译为"块级格式化上下文"。 它是一个独立的渲染区域，只有Block-level box参与， 它规定了内部的Block-level Box如何布局，并且与这个区域外部毫不相干。
白话文：规定一个渲染区域，其中区域内部的盒子如何布局，对外边的盒子无影响。
哪些元素会具有BFC的条件
display 属性为 block，table，list-item的元素，会产生BFC。
什么情况可以让元素产生BFC
- float 属性不为 none （加了浮动）
- position 为 absolute 或 fixed
- display 为 inline-block，table-cell，table-caption，inline-fiex
- overflow 不为 visible
BFC元素具有的特性
BFC主要用途
- 清除内部浮动
- 解决外边距合并
- 制作右侧自适应的盒子问题
BFC总结
BFC就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素。反之也如此。包括浮动，和外边距合并等等，因此，有了这个特性，我们布局的时候就不会出现意外情况了。
