为何需要清除浮动，以及清除浮动的方式

如题，介绍为何需要清除浮动？浮动的影响是怎么产生的？以及清除浮动的方式。

当元素有浮动属性时，高度会坍塌，高度的坍塌会对其父元素或后面的元素产生影响，出现布局错乱的现象，可以通过清除浮动的方法来解决。

浮动是将块元素独占一行的属性取消，允许其它元素与它在同一行，其核心就是使这个块从原来的文档流模式中分离出来，它后面的对象就视它不存在，浮动元素的高度不能撑起父元素的高度，也就出现了高度坍塌。

1、给父级div定义高度height
2、父级div设置overflow:hidden;
3、利用伪对象after方法，作用于浮动元素的父级

.clearFix:after{
    clear:both;
    display:block;
    height:0;
    content:"";
}
.clearFix{zoom:1;}

zoom:1的原理：当设置了zoom的值之后，所设置的元素就会扩大或缩小，高度宽度就会重新计算，这里一旦改变zoom值是其实也会发生重新渲染。
4、底部加一个空的div

<div class="clear"></div>
.clear{clear:both;}