Float布局补习

float设计的初衷是为了文字环绕。

他有以下特点：

1.破坏性。

设置了float:left;的子元素，**会脱离文档流。**既然脱离文档流了，那么父元素里相当于没有元素了，会坍塌。

问题来了，为什么float的设计会让父元素坍塌呢？

就是为了实现文字环绕效果啊。

2.包裹性

3.清空格

也同样利用float:left的特性。

清除浮动： 1.在父元素上加overflow:hidden;

2.在所有浮动子元素的下面加一个clear:both元素；不常用 3.clearfix，父元素设置

.clearfix:after{
	content:'';
    display:block;
    clear:both;
}

.clearfix{
	*zoom:1;  //兼容低版本
}

其实这个原理和方法2一样，创建一个伪元素，然后让父元素撑开。