解剖浮动

浮动的本意

让文字想流水一样环绕浮动元素。

浮动前：

浮动后

实现

浮动的特性

一：包含性

盒子不设置宽度，并且设置浮动，那么盒子的大小是由内容撑起来的。

如果在下面再加个div的话，效果近似于display:inline-block。但相比之下，浮动能设定为左浮和右浮，但display:inline-block都是从左到右排列的。（还有些细微差别，两个display:inline-block间会有空隙，但两个float间没有。）

二 ：高度欺骗

在正常流中父盒子没设置宽高，那么默认高度与盒子的高度相同
但是如果子盒子设置浮动，父盒子的高度就会塌陷，也就是说子盒子欺骗了父盒子，父盒子认为子盒子的内容为0。

清除浮动的方法