清除浮动float的方法总结

抛弃那些没用的方法，只记住最实用的一种方法即可！

给要清除浮动的父元素多加一个class属性：clearfix！！！

样式如下：

.clearfix:after{
     content:".";        
     display:block;        
     height:0;        
     clear:both;        
     visibility:hidden;        

}

为了兼容ie6,ie7（现在的项目几乎已经完全不考虑）

.clearfix{

zoom:1

}

清除浮动就是这么简单，可以作为公共样式common.css，每个页面都可以直接调用！

简单的实例应用：

　　

float:left">

　　　　//sth

　　

　　

:right">

　　　　//sth

　　

为什么要清除浮动：

1.之前写的时候都会发现页面写着写着就发生错乱，而且还有重叠？就是浮动惹的祸！

2.父级元素下面的子元素float时，可能会导致父级height值为0；故在使用了float之后，立即在父级上面加上clearfix，彻底消除float带来的各种怪异问题！

 

以上是清除浮动float的方法总结的详细内容。更多信息请关注PHP中文网其他相关文章！