布局

布局方法：流体布局(float)、冻结布局、凝胶布局、定位布局（position）、表格布局。

流动布局：float（浮动）

    1. float是脱离文档流，使元素向左或右移动，周围元素也会重新排列，多用于图像。

    2.浮动的块元素的下一个块中的行内元素会围绕该浮动块元素。

    3.应浮动元素是脱离文档流，所以它的下一个块元素忽略该元素，如果缩小浏览器窗口，会出现重叠现象（缺点一）。

    4.由于3因素，需对浮动元素的下一个块元素清浮动，使用clear：right；（解决了重叠现象，但缩小/放大浏览器时，块之间的空隙就很明显不美观，缺点二）。

    如图：

    5. 需注意的是需调整浮动的块元素位置。

如：box3要放置box1的右下角，需要把box3模块移至box1模块的下面。

 

 

    6. 相邻元素都浮动时，会按内联元素特性依次排，容不下时则换行紧挨上一个浮动的元素。