清除浮动小结

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会自动识别*而其他浏览器不会受到影响.

                   放心使用第四种清除方法.

另外:清除浮动只是清除浮动的影响,而不是去清除浮动的效果.