一、为什么要清除浮动
当我们为盒子设置浮动样式的时候，这是盒子将会脱离标准流，这样原先布局的其他内容将会占据盒子的位置，这样就没法看见相关内容。而在清除浮动之后，父级就会根据浮动的子盒子自动检测高度，父级有了高度，就不会影响下面的标准流了。二、常见清除浮动的方式
1.额外标签法（隔墙法）
额外标签法就是在浮动元素的末尾添加一个空标签。(空标签只能是块级元素)
<div class="leftBox">1</div><div class="rightBox">2</div><div style="clear: both;"></div></div><div class="normalBox"></div>
2.overflow方式清楚浮动
给父元素添加 overflow属性，并且属性值设置为hidden、auto或者scroll即可清除浮动
3.：after伪元素清除浮动
给父元素添加clearfix样式
.clearfix:after {content: "";display: block;clear: both;height: 0;visibility: hidden;}/* 兼容ie6ie7 */.clearfix {*zoom: 1}
4.双伪元素清除浮动
.clearfix:after,.clearfix:before {content: "";display: table;}.clearfix:after {clear: both;}/* 兼容ie6ie7 */.clearfix {*zoom: 1}
以上便是清除浮动的常见方式
注：文章仅供参考学习，如有侵权请联系作者
