div+css中position四个属性值(relative,absolute,static,fixed)的详解及区别

中position四个属性值是做为程序经常要用到的一个属性，那么在这里和大家一分来学习一下这四个属性值的定义及它们之间的区别。

先看下四属性值的定义：
1、static：默认值。没有定位，元素出现在正常的流中（忽略 top, bottom, left, right , z-index 声明）。
2、relative：生成相对定位的元素，通过top,bottom,left,right的设置相对于其正常位置进行定位。可通过z-index进行层次分级。
3、absolute：生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。可通过z-index进行层次分级。
4、fixed：生成绝对定位的元素，相对于浏览器窗口进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。可通过z-index进行层次分级。

static与定位用的比较少，也比较简单，在此不做分析。
下面对应用的较多的relative和absolute与fixed进行分析：
relative定位的层总是相对于其最近的父元素，无论其父元素是何种定位方式。
absolute定位的层总是相对于其最近的定义为absolute或relative的父层，而这个父层并不一定是其直接父层。如果其父层中都未定义absolute或relative，则其将相对body进行定位，
fixed：生成绝对定位的元素，相对于浏览器窗口进行定位。
原文参考自：协同oa软件 转载请注明