2.5 浮动布局
2.5.1 浮动导致的布局变动
- 对于块级元素来讲，在不设置宽度的情况下，默认的宽度是100%；一旦设置了浮动，他的宽度就会根据内容进行自动调整；
- 设置了浮动的元素会脱离正常的文档流；例如，默认情况下父元素的高度会根据子元素的内容进行调整，如果将子元素设置为浮动后，父元素的高度就会变为0；
- 虽然浮动元素脱离了文档流，但是里面的内容仍然占据空间，会根据相对位置进行布局；
2.5.2 清除浮动
- clear属性
.clear{
clear: both; /*左右两侧都不允许出现浮动元素*/
}
- 对父元素使用:after伪类
.clearfix:after{
clear: both; /*左右两侧都不允许出现浮动元素*/
}
2.6 CSS定位
position属性有五个值：static, relative, absolute, fixed, inherit;
2.6.1 相对定位---position: relative/static;
相对于其他元素进行定位，区别在于static不能控制位移，relative可以；
注意：脱离了文档流的元素，例如设置了浮动和绝对定位的元素不会对相对定位产生任何影响。
- static，默认值
在使用static的情况下，top、right、left、bottom、z-index都不会生效。
- relative
表现与static一样，只是可以通过设置top、right、left、bottom、z-index控制位置。
2.6.2 绝对定位
绝对定位的几个特点：
- 块级元素的宽度在未定义时不再为100%，根据内容自动调整，类似于设置了浮动。
- 脱离正常的的文档流。
- 在不定义z-index的情况下，absolute元素会覆盖在其他元素之上。
- absolute
相对于上一个不是static的父元素进行绝对定位，如果不指定父元素的position，absolute将会相对于整个html文档进行绝对定位；
- fixed
相对于浏览器窗口进行定位；
ie6，ie7不支持fixed属性，兼容性方案：
