消除浮动

当父盒子没有定义高度，嵌套的盒子浮动之后，下边的元素的位置会发生错误。因此要消除由于浮动而产生的不利影响。

额外标签法

在最后一个浮动元素后面添加标签

<div class='content'>
    <div class='content'></div>
    <div class='siderbar'></div>
    <div style='claer:both'></div>//这个就是额外的标签
</div>

给父盒子使用overflo：hidden

注意：如果父盒子包裹的内容出了盒子，则不能使用这个方法，因为出了范围的内容会消失不见。

伪元素清除浮动

.clear ::after{
    content:'';
    display:block;
    height:0;
    line-height:0;
    visiblity:hidden;
    clear:both;
}
//想要使得clear:both生效的元素必须时块级元素，conten属性必须要有，有了之后为元素才可以生效。

//引用的时候给父元素添加clear这个类即可。
<div class='father clear'></div>