1.关于浮动带来的影响:
浮动会使浮动元素脱离文档流.所以如果父级元素没有其他元素,父级元素会失去高度.所以我们要清除浮动的影响,使父级元素重新获取高度.
2.清除浮动的方法
a.父级元素设置高度(太low,不推荐);
b.父级元素添加overflow:hidden属性.(会对绝对定位造成影响,慎用)
c.在浮动元素后面添加空div.给这个div添加clear:both属性;(推荐,但是比较麻烦)
d.被大众所接受的方法:为父级元素添加类名.clearfix,为.clearfix:after添加如下样式
.clearfix:after{
display:block;
clear:both;
content:"";
}
优点:运用伪类:after清除浮动,并且不用担心IE6兼容问题.IE6有单独的清除浮动的方法
*clearfix{zoom:1}.IE6会自动识别*而其他浏览器不会受到影响.
放心使用第四种清除方法.
另外:清除浮动只是清除浮动的影响,而不是去清除浮动的效果.