在CSS中关于定位的内容是：position:relative | absolute | static | fixed
● static 没有特别的设定，遵循基本的定位规定，不能通过z-index进行层次分级。
● relative 不脱离文档流，参考自身静态位置通过 top,bottom,left,right 定位，并且可以通过z-index进行层次分级。
● absolute 脱离文档流，通过 top,bottom,left,right 定位。选取其最近的父级定位元素，当父级 position 为 static 时，absolute元素将以body坐标原点进行定位，可以通过z-index进行层次分级。
● fixed 固定定位，这里他所固定的对像是可视窗口而并非是body或是父级元素。可通过z-index进行层次分级。
CSS中定位的层叠分级：z-index: auto | namber;
● auto 遵从其父对象的定位
● namber 无单位的整数值。可为负数
什么是文档流：
文档流是文档中可显示对象在排列时所占用的位置。比如网页的div标签它默认占用的宽度位置是一整行，p标签默认占用宽度也是一整行，因为div标签和p标签是块状对象。
文本流是相对于文子段落
元素浮动之后，会让它跳出文档流，也就是说当它后面还有元素时，其他元素会无视它所占据了的区域，直接在它身下布局。但是文字却会认同浮动元素所占据的区域，围绕它布局，也就是没有拖出文本流。
但是绝对定位后，不仅元素盒子会拖出文档流，文字也会出文本流。那么后面元素的文本就不会在认同它的区域位置，会直接在它后面布局，不会在环绕。
当然你可以使用 index-z 来让底部的元素到上面来，类似于一个图层的概念
下面为表格说明：
| 父级标签无position限定 | 父级标签用static限定 | 父级标签用fixed限定 | 父级标签用absolute限定 | 父级标签用relative限定 | |
| fixed | 相对可视窗口 | 相对可视窗口 | 相对可视窗口 | 相对可视窗口 | 相对可视窗口 |
| absolute | 相对body | 相对body | 相对body | 相对父级 | 相对父级 |
| relative | 相对文本流定位（与父级有间接关系） | ||||
| static |
相对父级定位 top等限定无效 |
相对父级定位 top等限定有效 |
相对父级定位 top等限定有效 |
相对父级定位 top等限定有效 |
相对父级定位 top等限定有效 |
z-index计算规则
z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。
层级关系的比较
1. 对于同级元素，默认(或position:static)情况下文档流后面的元素会覆盖前面的。
2. 对于同级元素，position不为static且z-index存在的情况下z-index大的元素会覆盖z-index小的元素，即z-index越大优先级越高。
3. IE6/7下position不为static，且z-index不存在时z-index为0，除此之外的浏览器z-index为auto。
4. z-index为auto的元素不参与层级关系的比较，由向上遍历至此且z-index不为auto的元素来参与比较。