第四章 盒子的浮动与定位
4.1 盒子的浮动
在标准流中，一个块级元素在水平方向会自动伸张，直到包含它的元素的边界；而在竖直方向和兄弟元素依次排列，不能并排。使用“浮动”方式后，块级元素就可以并排了。
CSS中的float属性，默认为none。就是标准流通常的情况。 如果将float属性的值设置为left或right，元素就会向其父元素的左侧或右侧靠紧。同时默认情况下，盒子的宽度不再伸张，而是根据盒子里面的内容的宽度来确定。
4.1.1 准备代码
对浮动的解决方法，用clear清除浮动
clear属性有 left、right、both。同时消除左右两边的影响。
对div设置浮动后，会导致父div没有高度，只有border和 padding 的值，因为浮动后就不在标准流中。 可使用以下几种方式解决：
· 在子div后增加一个<div style="clear:both"></div>
` 或者设置父div的高度。
4.2 盒子的定位
position属性可以设置为4个属性值之一：
1. static： 这是默认的属性值，也就是该盒子按照标准流（包括浮动方式）进行布局；
2. relative：称为相对定位，使用相对定位的盒子的位置常以标准流的排版方式为基础，然后使盒子相对于它在原本的标准位置偏移指定的距离。相对定位的盒子仍在标准流中，它后面的盒子仍以标准流方式对待它。
3. absolute：绝对定位，盒子的位置以它的包含框为基准进行偏移。绝对定位的盒子从标准流中脱离。这以为着它们对其后的兄弟盒子的定位没有影响，其他的盒子就好像这个盒子不存在一样。
4. fixed：称为固定定位，它和绝对定位类似，只是以浏览器窗口为基准进行定位，也就是当拖动浏览器窗口的滚动条时，依然保持对象位置不变。
4.2.1 static（静态定位）
原文：http://www.cnblogs.com/leeshine-luo/p/5240513.html