清除浮动

容器有时候会不包围浮动元素，这时候就要清除浮动。暂时列出下面几种方法：

1、直接在某个元素上应用clear，当没有可用的元素（所有元素都浮动）的时候可以添加一额外元素：

   

some text

   

some text

   
 

.news{

    background-color:gray;

    border: solid 1px black;

}

.news .left{

    float:left;

}

.news .right{

    float:right;

}

.news br{

    clear:both;

}

some text

some text

2、直接浮动div容器。

3、将div容器的overflow属性设定为hidden。

4、使用伪元素。

   

some text

   

some text

.news{

    background-color:gray;

    border: solid 1px black;

}

.news .left{

    float:left;

}

.news .right{

    float:right;

}

.clear:after{

    content:".";

    height:0;

    visibility:hidden;

    display:block;

    clear:both;

}

转载于:https://www.cnblogs.com/luke21/p/3610410.html