float的理解

1、浮动包裹性——浮动具有让元素按displya:inline-block显示(如果没有设置宽度和高度，则它可以显示的尽量窄高
度尽量小)。
2、浮动破坏性——浮动元素漂浮在标准流之上(但没有脱离文档流)，破坏了正常文档流的显示顺序。浮动元素的下一

个元素(block)，会和上一个非浮动的block元素底部垂直对齐。浮动元素的垂直位置会和上一个标准流元素(block)的

底部对齐。浮动破坏了正常的line boxes，浮动元素紧挨着的下一个非浮动的block元素里面的非block元素会环绕着浮动元素(文字环绕效果)。
3、浮动跟随性——如果A、B两个元素（block）挨着且两个元素都进行浮动了，那么B元素会跟在A元素后面显示成一行

，只到宽度不够时才会被挤到下一行。
4、浮动产生父元素高度塌陷——如果一个div中有两个子div，且都是进行浮动的，如果父div没有设置高度，这时父

div的高度为0，这时就产生了高度塌陷（父元素的高度为0是因为两个子div浮动元素脱离标准流，漂浮在标准流之上，

所以不能把父元素高度撑开，可以通过清楚浮动解决）。

可参考：

http://www.zhangxinxu.com/wordpress/2010/01/css-float%E6%B5%AE%E5%8A%A8%E7%9A%84%E6%B7%B1%E5%85%A5%E7%A0%94%E7%A9%B6%E3%80%81%E8%AF%A6%E8%A7%A3%E5%8F%8A%E6%8B%93%E5%B1%95%E4%B8%80/

http://www.w3cfuns.com/home.php?mod=space&uid=5452328&do=blog&id=5406135

http://www.cnblogs.com/iyangyuan/archive/2013/03/27/2983813.html