清除浮动的应用

思考：清楚浮动指清除掉元素float属性，那么为什么需要用到清除浮动呢？

在我刚开始的浮动学习中，浮动元素一般有一个标准流的父元素，且父元素都有一定的高度，那么，假设当父元素不便指定行高时（ex：子元素具有拓展性，可以增添新内容），那么倘若子元素都是浮动元素，则会出现父元素高度为0的情况，此时子元素在页面内则不再占有独立的位置，会产生与后面的块元素叠加的现象。

为父元素设置了行高

可见页面布局效果正常 

此时我把父元素的行高进行注释

则发生了由于浮动所导致的父元素行高为0的问题 

因此，此处必须应用清除浮动，以达到令父元素自动检测子元素来生成行高的效果

清除浮动的四种方法：

1. 额外标签法。
2. 父级加overflow。
3. 父级加after伪元素。
4. 父级添加双伪元素。