CSS-position系列属性
<pre>
CSS-position系列属性总结，写记下来，希望对大家有帮助，供新人学习，老人查阅，共勉。
------DanlV
</pre>
position属性一般分为三个方面：相对定位(position:relative)、绝对定位(position:absulote)、固定定位(position:fixed)。下面具体来写这三种的特点及其用法。
相对定位position:relative
什么是相对定位？
相对定位是根据自己原来的位置来进行移动定位。
相对定位的特性
1.微调元素，相对于自己原来的位置移动，位移通过设置方向left right top bottom的值来进行移动
2.不脱标，形影分离，身体留在原本位置（本体看不见但还是占有位置），影子移动
不脱标：不脱离标准文档流和标准文件流
相对定位常见用途
1.微调元素
2.做绝对定位的参考 -- 子绝父相 即：子元素采用绝对定位，父元素采用相对定位
绝对定位 position:absolute
什么是绝对定位？
根据参考元素来进行定位。
绝对定位的特性
1.根据参考点来进行位移
- 位移通过设置方向left right top bottom的值来进行移动
- 参考点
--- 绝对定位的元素没有父元素
--->绝对定位的参考点，如果用top描述，那么定位参考点就是
页面的左上角，而不是浏览器的左上角
--->如果使用bottom来描述，就是浏览器首屏窗口，左下角
--- 如果父级有定位属性
--->就以父级为参考点，如果父级没有定位，就继续向上层去找
--->如果一个盒子设置了绝对定位，并且向一个方向上位移，那么与这个方向相同的padding值将会失效
2.绝对定位脱标 ，如果父元素没有相对定位，那么脱标带来的影响将无法解决。
TIPS：子元素采用绝对定位的话，所对应的参考系为父元素的定位，若父元素定位无，则向上寻到已定位的元素，根据此元素绝对定位。
绝对定位的盒子居中
1.绝对定位之后，所有标准流的规则，都不适用了。所以margin:0 auto;失效。
2.居中：left:50%;margin-left:负的宽度的一半。
固定定位position:fixed
- 固定定位就是相对浏览器窗口定位。页面无论如何滚动，这个盒子显示位置不变
- 固定定位的盒子脱标
- 缺点：ie6不兼容
z-index
在定位的盒子两个之间产生覆盖时，造成一个盒子盖住另一个盒子的现象，可以设计z-index属性值来说设置优先级。
- z-index值表示谁压着谁。数值大的压盖住数值小的。
- 只有定位了的元素，才能有z-index值。也就是说，不管相对定位、绝对定位、固定定位，都可以使用z-index值。而浮动的东西不能用。
- z-index值没有单位，就是一个正整数。默认的z-index值是0
- 如果大家都没有z-index值，或者z-index值一样，那么谁写在HTML后面，谁在上面能压住别人。定位了的元素，永远能够压住没有定位的元素。
- 从父现象：子元素的z-index值再大也打不过父元素，父元素之间的相互比较定级，子元素听从父元素的z-index的胜负。
