为什么要清除浮动元素呢？上一节已经说到了浮动元素float，大家可以知道，他们一个“气球”漂浮原理，div/块状元素漂浮到空中之后，它下面的div/块状元素就会自动占据它原来的位置往上一层挪，为了让漂浮起来的div不影响下面div的位置，这个时候就得引入“clear清除元素”来实现。

情况一：如图：

注释：可以看到，此时下面蓝色的div由于加上了clear:both,所以它就不会在红色div和紫色div漂浮起来的情况下，自动占据他们原来位置，仍然占着自己原来位置不动。

情况二：如图–

注释：红色div设置了左浮动，紫色div右浮动，都漂浮起来，而且红色div宽高都最小，然后下面蓝色的div由于加上了clear:left,所以这个时候蓝色div会跟紫色div重叠一部分