当我们在给某个元素定义了样式float属性为left或right时,此元素会变为浮动层,浮动在它的父级元素。如果要清除浮动,就要使用样式的clear属性。但是IE6浏览器与其它浏览器清除方法有些不同。IE6浏览器清除浮动需要在浮动层的父级元素使用clear:both和zoom:1两个属性,IE7和IE8和其它浏览器清除浮动需要在浮动层的父级元素使用clear:both和overflow:hidden两个属性。clear:both属性会清除浮动层的父级元素的浮动,overflow:hidden属性会清除浮动层本身,致使浮动层和浮动层父级元素处于同一层空间,IE6浏览器的zoom:1属性和其它款浏览器overflow:hidden属性效果相同,zoom:1触发IE6隐藏私有属性Layout清除浮动层本身,IE6浏览器上使用overflow:hidden属性是不能够清除浮动的,相应效果请自行查看演示页面。最后清除浮动的样式组合如下:

clear: both;

overflow: hidden;

zoom: 1;

演示:http://demo.joyfulboy.cn/css/clearFloat/