css 清除浮动

标签：属性   缺点   元素   over   line   play   str   display   clear   

功能: 实现图文混排效果

原理: 绝对定位的元素脱离了文档流，而浮动元素依旧在文档流中；

清除浮动：(高度塌陷)

1. 额外标签法，<div style="clear:both;"></div>（缺点：不过这个办法会增加额外的标签使HTML结构看起来不够简洁。）

2. 使用after伪元素(该方法中必须为需要清除浮动元素的伪对象中设置 height:0，否则该元素会比实际高出若干像素)

      #parent{zoom: 1}

#parent:after{

    content:".";

    height:0; //line-height: 0;

    visibility:hidden;

    display:block;

    clear:both;

}

3. overflow + zoom方法(zoom, IE独有属性,类似于缩放)

.fix{overflow:hidden; zoom:1;}

(有问题的，就是这个overflow:hidden;是个小炸蛋，要是里面的元素要是想来个margin负值定位或是负的绝对定位，岂不是直接被裁掉了，所以此方法是有不小的局限性的。)

css 清除浮动

标签：属性   缺点   元素   over   line   play   str   display   clear   

原文地址：http://www.cnblogs.com/peiling-home/p/7087384.html