Position绝对定位与相对定位个人理解

语法：

position : static | absolute | fixed | relative

取值：

static	:	默认值。无特殊定位，对象遵循HTML定位规则
absolute	:	将对象从文档流中拖出，使用 left ， right ， top ， bottom 等属性相对于其最接近的一个最有定位设置的父对象进行绝对定位。如果不存在这样的父对象，则依据 body 对象。而其层叠通过 z-index 属性定义
fixed	:	未支持。对象定位遵从绝对(absolute)方式。但是要遵守一些规范
relative	:	对象不可层叠，但将依据 left ， right ， top ， bottom 等属性在正常文档流中偏移位置

 

此处不讨论fixed属性，只讨论static，absolute，relative

个人理解如下：

1.没有设定position的元素都是static状态

2.absolute的定位位置视乎父级元素（或父级的父级的父级……）是否设置了absolute或relative中的一个。如果设置了，参照父级元素的位置定位，如果没有设置，也就是static状态下，那就是按照整个浏览器窗口进行定位。

3.absolute是层叠的，而relative不是，只是相对于它本来应该出现的位置进行偏移（没有relative属性的时候它在什么位置，加了relative属性就是根据该位置偏移）。