CSS控制DIV绝对定位、相对定位的技巧

我们在网页设计中常常会用到position属性，里面有5个值，分别是：absolute、fixed、relative、static、inherit。

常用到的其实就是absolute和fixed。

absolute：生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。

fixed：生成绝对定位的元素，相对于浏览器窗口进行定位。

这两个值的区别在于，一个是相对于static的父元素定位，一个是相对于浏览器窗口定位。

不少朋友在使用absolute的时候发现它“似乎”也是针对浏览器窗口定位的，其实是因为没有设置父元素的static值。

代码应该这样写：

<div id="parent" style="position:static;">
 <div id="son" style="position:absolute; top:0; left:10px;"></div>
</div>

这样，id为son的div才会相对于id为parent的div进行“绝对定位”。

而fixed就完全不受任何约束了，不过在IE6浏览器下是无效的，IE8以后都是可以正常使用的了。