什么是BFC?

来源:互联网 发布:阿里云华南 编辑:程序博客网 时间:2024/06/09 20:06

   BFC(Block formatting context)直译为块级格式化上下文。它的作用是创建一个封闭的区域,从而形成一个这样的局面:该封闭区域内部的布局与外部的区域互相不会有任何影响。有以下几种因素会形成BFC:

1.根元素(也就是html元素)

2.float属性不为none的元素

3.position为absolute和fix的元素 

4. display为inline-block,table-cell, table-caption, flex, inline-flex 非块框的块容器

5.overflow不为visible的元素。

这就是为什么我们经常用overflow:hidden去清除内部浮动的原因

6.触发IE的hasLayout特性(这个不甚了解)。


了解了以上形成BFC的元素之后,我们也就明白了清除浮动的目的也就是为了形成一个BFC区域,从而不让布局受到浮动的影响。







 

原创粉丝点击