css 中Position属性及值的作用和用法

position有四种可选值

1.static:默认属性值

2.relative:相对定位,

  1)使用相对定位的盒子，会相对于它在原本的位置，通过偏移指定的距离，到达新的位置

  2)使用相对定位的盒子荏在标准流中，它对父块和兄弟盒子没有任何影响

3.absolute:绝对定位，

  1)使用绝对定位的盒子以它的"最近"的一个"已经定位"的"祖先元素"为基准进行偏移。

    如果没有已经定位的祖先元素，那么会以浏览器窗口为基准进行定位。

  2)绝对定位的框从标准流中脱离,它们对其后的兄弟盒子的定位没有影响，其它盒子就好像这个盒子不存在一样。

  3)如果设置了绝对定位，而没有设置偏移属性，那么它仍将保持在原来的位置。

  说明："已经定位"的含义是，position属性被设置，并且被设置为不是static的任意方式，那么该元素就被定义为"已经定位"的元素

        "祖先元素"的含义是，即为"BOM"树中所指的父节点

        "最近"，找出所有"已经定位"的元素，其中离该节点最近的一个节点，父节点比祖父节点近，祖父节点比曾祖父近，以此类推

4.fixed:固定定位,

  与absolute类似，区别在它的基准不是祖先元素，而是浏览器窗口或者其它显示设备的窗口，IE6不支持

总结：

     最容易混淆的是relative和absolute的属性，它们之间的区别是：

     1.relative是相对与自己原来所在空间进行移位显示，而absolute则是根据另一盒子去定位

     2.relative设定的偏移，其它父块和兄弟盒子就不知道它有移位这回事，一直就认为它在原处

       而absolute属性设定后其它父块和兄弟盒子认为它已经不在了