BFC(Block Formatting Context)理解

BFC：即块级格式上下文；在创建BFC的情况下，则所属的作用环境就变成了一个独立的布局环境。
在BFC中，盒子从顶端开始垂直地一个接一个地排列，两个盒子之间的垂直的间隙是由他们的margin 值所决定的。
在一个BFC中，两个相邻的块级盒子的垂直外边距会产生折叠。

在BFC中，每一个盒子的左外边缘（margin-left）会触碰到容器的左边缘(border-left)
（对于从右到左的格式来说，则触碰到右边缘）。

如何创建BFC
当一个HTML元素满足下面条件的任何一点，都可以产生Block Formatting Context：
float的值不为”none”
overflow的值不为”visible”
display的值为 “table-cell”, “table-caption”, or “inline-block”中的任何一个
position的值不为 “static” 或 “relative”中的任何一个
我是一个使用浮动布局的孩子来的。今天才知道了这种原来也有可以不用清除浮动来布局，
只要对BFC这个概念清晰明了，完全可以不用清除浮动来布局了。