css定位详解

参考文档 CSS定位[absolute，relative]详解

值	描述
inherit	从父元素继承 position 属性的值。
static	默认值。元素出现在正常流中。 top, bottom, left, right 以及 z-index 不生效
relative	相对定位，相对于自己的正常位置进行定位。
absolute	绝对定位，相对于 static 定位以外的第一个父元素进行定位。 元素的位置通过 “left”, “top”, “right” , “bottom” 规定。
fixed	绝对定位，相对于浏览器窗口进行定位。 元素的位置通过 “left”, “top”, “right” 以及 “bottom” 规定。

对于absolute和relative的理解， CSS定位[absolute，relative]详解写的很详细，特别注意：

由于绝对定位元素脱离正常流(文档流)，所以元素原来的位置会被其他元素占用；也可能覆盖其他元素

补充

• inherit：继承自父元素。
  父元素如果没定义，即父元素采用了默认值static，那么子元素继承的也是static
• 如果定义了position，但没有定义相对位置[left，top等]：
  初始化渲染时，会按照static方式，即在正常流中。
  页面滚动时，按照定位方式确定的相对元素，保持相对位置不变：
  —absolute元素：相对于 static 定位以外的第一个父元素保持位置不变
  —fixed元素：相对于窗口保持位置不变