css之BFC（block formmatting context）[格式化上下文]

 

一、定义：
BFC就是一个黑盒子，可以保证盒子内部元素不管如何变化，都不会影响盒子附近的元素；它属于普通流、浮动、定位方案中的普通流。

二、触发条件：
1.body；
2.float(不包含none)，position(不包含static);
3.display 为 inline-block、table-cells、flex
4.overflow(不包含visible)

三、BFC特性以及其应用：
1.同一个BFC盒子下面的2个元素的下外边距会发生折叠；
2.BFC元素可以包含浮动元素；
3.BFC可以阻止被浮动元素覆盖；(可以用这个实现2列自适应布局)

内容提取来源：https://zhuanlan.zhihu.com/p/25321647

 

转载于:https://www.cnblogs.com/wenwenwei/p/10017858.html