定位与层级
1. 定位 position
1.1 静态定位 static
每个元素的默认值，将元素放入它在文档布局流中的正常位置。
1.2 相对定位 relative
开启定位后，可以使用top、right、bottom，left四个属性设置偏移量。选择一个垂直方向和竖直方向上的偏移量即可为一个元素定位。
要点
- 相对定位的元素不会脱离文档流
- 开启相对定位后，如果不设置偏移量，元素不会发生任何变化
- 相对定位是相对于元素在文档流中原来的位置进行定位
- 相对定位会使元素提升一个层级
- 相对定位不会改变元素的性质
1.3 绝对定位 absolute
定位方式同上
要点
绝对定位的元素会脱离文档流
开启绝对定位后，如果不设置偏移量，元素不会发生任何变化
绝对定位是相对于离他最近的开启了定位的祖先元素进行定位的（一般情况，开启了子元素的绝对定位都会同时开启父元素的相对定位）
- 如果所有的祖先元素都没有开启定位，则会相对于浏览器窗口进行定位绝对定位会使元素提升一个层级
绝对定位会改变元素的性质
- 内联元素变块元素
- 块元素的宽度和高度默认都被内容撑开
1.4 固定定位 fixed
定位方式同上
要点
固定定位也是一种绝对定位，大部分特点与绝对定位一致，不同的是
- 固定定位永远都会相对于浏览器窗口进行定位
- 固定定位会固定在浏览器窗口某个位置，不会随滚动条滚动
- IE6不支持固定定位
2.层级 z-index
要点
- 如果定位元素的层级是一样，则下边的元素会盖住上边的
- 层级越高，越优先显示
- 对于没有开启定位的元素不能使用z-index
- 定位的元素都具有z-index为auto，实际上为0