float：
float:left | right | none | inherit
1、块在一行显示
2、内嵌支持宽高
3、默认内容撑开宽度
4、脱离文文档流
5、提升层级半层
-------------------------------------文档流--------------------------------
文档流是文档中可显示对象在排列时所占用的位置。
浮动的定义：使元素脱离文档流，按照指定方向发生移动，遇到父级边界或者相邻的浮动元素停了下来。
clear:left | right | both | none | inherit；元素的某个方向上不能有浮动元素
clear:both;在左右两侧均不允许浮动元素
-------------------------------------清除浮动方法---------------------------
1、加高（扩展性不好）
2、父级浮动（margin左右会消失，页面所有元素都得加浮动）
3、inline-block（margin左右会消失）
4、空标签（ie6最小高度19px）height：0；font-size:0（overflow：hidden）;
5、overflow：hidden（需要配合宽度或zoom兼容ie6和ie7）
6、br（结构，样式，行为分离）
7、after伪类
-------------------------------------浮动兼容性问题--------------------------
IE6双边距BUG（IE6下块属性标签浮动，并且有横向margin，横向margin加倍。）
1、IE6
2、块元素（加display：inline-block）
3、浮动
4、横向margin
IE6下 li部分兼容性问题：
a、左右两列布局，右边右浮动IE6 IE7下折行；(左边元素浮动)
b、IE6 IE7li下元素都浮动 在IE6 IE7下 li 下方会产生3px间隙问题；（加vertical-align:top；）
vertical-align 垂直对齐方式
a、加垂直对齐方式的同排元素都要加垂直对齐方式；
b、垂直对齐方式可以解决元素下方间隙问题；
图片下方间隙问题
a、display:block; (改变标签本身特性)
b、overflow:hidden; (必须知道图片高度)
d、vertical-align (暂时最完美的方案)
