来源：自学PHP网 时间：2015-04-14 14:51 作者： 阅读:次
[导读] BFC(Block Formatting Context)，简单讲，它是提供了一个独立布局的环境，每个BFC都遵守同一套布局规则。例如，在同一个BFC内，盒子会一个挨着一个的排，相邻盒子的间距是由margin决定且垂直...
|
BFC(Block Formatting Context)，简单讲，它是提供了一个独立布局的环境，每个BFC都遵守同一套布局规则。例如，在同一个BFC内，盒子会一个挨着一个的排，相邻盒子的间距是由margin决定且垂直方向的margin会重叠。而float和clear float也只对同一个BFC内的元素有效。
非块级盒子的浮动元素、绝对定位元素及块级容器(比如inline-blocks，table-cells和table-captions)，以及overflow属性是visible之外任意值的块级盒子，都会创建了一个BFC。即当元素CSS属性设置了下列之一时，即可创建一个BFC:
float：left|right
position：absolute|fixed
display: table-cell|table-caption|inline-block
overflow: hidden|scroll|auto
IE中HasLayout是IE浏览器引擎内部特有的属性，它可以影响到元素的定位和元素之间的相互作用。当一个元素的HasLayout属性为true时，这个元素才可以决定自己和其子孙元素的布局。
所以，当发现有些元素的布局在IE下有异常时，可以有充分的理由来怀疑可能是hasLayout属性为false。而且这个属性值不能直接设置。一个元素要么默认拥有，要么通过设置特定的CSS属性来获取。直接的使元素hasLayout属性值为true的方法是声明下面的CSS属性之一：
width: 除auto之外的值
height: 除auto之外的值
float: left|right
position: absolute
display: inline-block
writing-mode: tb-rl(IE)
zoom: 除normal之外的值
IE7中增加了一些同样效果的属性：
min-height: 任意值
max-height: 除 “none” 之外的任意值
min-width: 任意值
max-width: 除 “none” 之外的任意值
overflow: hidden|scroll|auto
overflow-x: hidden|scroll|auto
overflow-y: hidden|scroll|auto
position: fixed
最常用的是zoom:1，因为这个设置对元素外观不会造成任何影响。但是这个属性是IE特有的CSS属性，不会通过CSS检查器W3C提供的CSS校验器（当然，让不让通过校验实际取决于各种校验器的规则）。
|
自学PHP网专注网站建设学习,PHP程序学习,平面设计学习，以及操作系统学习
京ICP备14009008号-1@版权所有www.zixuephp.com
网站声明：本站所有视频，教程都由网友上传，站长收集和分享给大家学习使用，如由牵扯版权问题请联系站长邮箱904561283@qq.com
