码迷,mamicode.com
首页 > 其他好文 > 详细

清除浮动的几种方法

时间:2017-06-13 00:13:08      阅读:178      评论:0      收藏:0      [点我收藏+]

标签:isp   语义   div   标准   log   class   style   解决   问题   

“清除浮动”这个说法容易让人产生误解,我认为这个说法的本意应该是“清除浮动带来的负面效果”,这个负面效果即“子元素的浮动会脱离标准文档流,从而造成父元素的高度塌陷”。

解决这个问题有如下几个目前流行的做法。

一、浮动的子元素后加一个空的div,并加上clear:both属性;

二、BFC方法

      (1)父元素加上overflow:hidden,该方法会带来IE6的兼容性问题,并且也限制了父元素的本身的overflow语义;

      (2)针对IE6,父元素加上zoom:1属性;

三、父元素加上after伪元素,IE6和7不兼容:

1 .parent:after{
2     content:"";
3     display:table; /* 或者block */
4     clear:both;
5 }

总结:推荐使用第三种方法,如果要考虑IE的6和7问题,就使用第二种方法。

清除浮动的几种方法

标签:isp   语义   div   标准   log   class   style   解决   问题   

原文地址:http://www.cnblogs.com/stephen666/p/6995254.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!