css中的position

CSS中Position属性有四个可选值：
- position:static　无定位
该属性值是所有元素定位的默认情况，在一般情况下，我们不需要特别的去声明它，但有时候遇到继承的情况，我们不愿意见到元素所继承的属性影响本身，从而可以用position:static取消继承，即还原元素定位的默认值。
- position:absolute　绝对定位
使用position:absolute，能够很准确的将元素移动到你想要的位置，
- position:fixed　相对于窗口的固定定位
这个定位属性值是什么意思呢？元素的定位方式同absolute类似，但它的包含块是视区本身。在屏幕媒体如WEB浏览器中，元素在文档滚动时不会在浏览器视察中移动。例如，它允许框架样式布局。在页式媒体如打印输出中，一个固定元素会出现于第一页的相同位置。这一点可用于生成流动标题或脚注。我们也见过相似的效果，但大都数效果不是通过CSS来实现了，而是应用了JS脚本。
请特别注意，IE6不支持CSS中的position:fixed属性。
- position:relative　相对定位
所谓相对定位到底是什么意思呢，是基于哪里的相对呢？我们需要明确一个概念，相对定位是相对于元素默认的位置的定位。既然是相对的，我们就需要设置不同的值来声明定位在哪里，top、bottom、left、right四个数值配合，来明确元素的位置。
定位和父元素的关系ps:tl指top、left，ab、re指absolute、relative

父元素	子元素	结论
absolute	absolute	子随父的tl偏移
absolute	relative	子随父的tl偏移
absolute	static	子随父的tl偏移
relative	absolute	子随父的tl偏移
relative	relative	子随父的tl偏移
relative	static	子随父的tl偏移
static	absolute	子越过父寻上级父(有ab/re属性值得)直至body的tl偏移
static	relative	子随父的tl偏移
static	static	子不随父的tl偏移

fixed指相对于浏览器窗口固定布局，所以未在表中显示。fixed一旦设置会随浏览器的上拉下拉而偏移。
总结：
1. relative定位的层总是相对于其最近的父元素，无论其父元素是何种定位方式
2. 对于absolute定位的层总是相对于其最近的定义为absolute或relative的父层，而这个父层并不一定是其直接父层。如果其父层中都未定义absolute或relative，则其将相对body进行定位。
3. 定位为relative的元素脱离正常的文本流中，但其在文本流中的位置依然存在。
4. 定位为absolute的层脱离正常文本流，但与relative的区别是其在正常流中的位置不在存在。