浮动的工作原理和清除方法

浮动元素脱离文档流,不占据空间。浮动元素喷到包含它的边框或者浮动的元素的边框停留》

清除浮动的方法

1.使用空标签清除浮动

给所有浮动标签后面添加一个空标签   定义CSS  clear:both.

但是这种方法会增加一个无意义的标签。

2.使用overflow

给包含浮动元素的父标签添加CSS属性 overflow:auto;zoom1;  zoom1是用来兼容IE6的。

3.使用after伪类对象清除浮动

这个方法只适用于非IE浏览器。该方法必须为需要清除浮动元素的伪对象中设置height:0,不然该元素会比实际元素高出若干像素。

#parent:after{
    content:".";
    height:0;
    visibility:hidden;
    display:block;
    clear:both;
    }


4.浮动外部元素



你可能感兴趣的:(css)