清除浮动的作用

如果一个父盒子没有设置高度，且其子元素设置了浮动，那么由于子元素浮动脱离了标准流，则父盒子撑不起来高度。

当父盒子下面还有一个盒子的时候，所以下面的盒子会上移占据父盒子的位置。这时候就要清楚浮动。

一般使用伪元素：after ：before清除浮动

在要清楚的浮动的元素的类名中加一个类名

<div class="father clearfix"><div class:"son"></div></div><div></div>

.clearfix:after {content: "";height: 0;line-height: 0;display: block;visibility: hidden;clear: both;}.clearfix {zoom: 1;}.father {width:200px;.son { float:left;}

这样就在父盒子后面清楚了浮动，父盒子下面的盒子可以正常显示了。