首页 > 代码库 > 万能清理浮动写法

万能清理浮动写法

 

CSS:

.clearfix:after {
    content: "";
    display: block;
    height: 0;
    clear: both;
}
.clearfix { zoom: 1; }

.clear { clear: both; }

 

原理:对于子元素浮动的元素,使用clearfix来清理。Firefox等标准浏览器以及IE8+支持:after属性,会使用clearfix:after进行清理,对于IE6和7,不支持:after属性,会使用zoom属性来清理,且zoom属性只有IE系列可以识别,并且IE8及之后浏览器使用zoom无法触发layout来实现清理。需要使用独立标签进行清理的话,使用clear来清理。

 

兼容所有浏览器

 

万能清理浮动写法