一、浮动的本质是为了实现文字环绕的效果;
二、清除浮动带来的影响:
1. 普通浏览器 fix:after{content:'';display:table;clear;both}
2.IE8 fix{*zoom=1 }
三、浮动与流式布局
1.文字环境衍生-单侧固定,浮动与单侧尺寸固定的流体布局
https://www.imooc.com/code/2889
width+float
padding-left/margin-left
2.DOM与显示位置匹配的单侧固定布局,浮动与右侧尺寸固定的流体布局
https://www.imooc.com/code/2890
width:100%+float
padding-left/margin-left
width+float+margin负值
3.高级进化-智能自适应尺寸,浮动与两侧皆自适应的流体布局
https://www.imooc.com/code/2888
float
display:table-cell IE8+
display:inline-block IE7
本文心得来自张鑫旭大师慕课网的css深入了解之float 浮动