css 清除浮动方法

1.使用空标签清除浮动
<style type="text/css">
.clear{clear:both;font-size:0px;height:0px;line-height:0px;overflow:hidden;}
</style>
<div style="background:blue;">
<div style="float:left;width:400px;height:300px;background:red;">red</div>
<div style="float:left;width:400px;height:300px;background:gray">ball</div>
<div class="clear"></div>
</div>
2.使用after伪对象清除浮动
<style type="text/css">
.ft_clear:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0;}
.ft_clear {zoom:1;}/*IE6*/
</style>
<div style="background:blue;" class="ft_clear">
<div style="float:left;width:400px;height:300px;background:red;">red</div>
<div style="float:left;width:400px;height:300px;background:gray">ball</div>
</div>