BFC 生成 特性 解决的问题

BFC( 块级格式化上下文 )

块级格式化上下文,它是指一个独立的块级渲染区域,

只有 Block­level BOX 参与,该区域拥有一套 

渲染规则来约束块级盒子的布局,且与区域外部无关.

如何生成BFC

1、根标签 

2float 的值不为 none 

3overflow 的值不为 visible  

4display 的值 inline­block ,table-cell,table-caption

5position 的值 absolute  fixed

BFC 的特性

1.内部的标签会在垂直方向上一个接一个的放置 

2.垂直方向上的距离由 margin 决定,属于同一个 BFC

的两个相邻标签的 margin 会发生重叠 

3.每个标签的左外边距与包含块的左边界相接触(从左

向右),即使浮动标签也是如此。 

4.BFC 的区域不会与 float 的标签区域重叠 

5.计算 BFC 的高度时,浮动子标签也参与计算 

6.BFC 就是页面上的一个隔离的独立容器,容器里面的

原文地址:https://www.cnblogs.com/ximenchuifa/p/13288614.html