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属性设定后其它父块和兄弟盒子认为它已经不在了