初学遇到的样式问题--position

当position设置为relative、absolute、fixed时才会有top、left、bottom、right定位属性。使用定位属性时，如果用的单位是%，那么一定要指定其父盒子（其所在容器）的大小，含义是"相对父盒子的比例"。否则top、bottom将不会有效果；如果用的单位是px，那么就无所谓了。

1.　对于"相对定位"【position：relative；】

     　　相对定位的规律：

　 　　 使用【position：relative；】后会相对于 原本的位置 偏移指定的距离，但即使移动到了父盒子的外面，对父块也不会有任何影响。本质原因是：使用了相对定位的盒子依旧在标准流中(标准流：当不使用其他排列和定位相关的特殊的CSS规则时，各种元素的排列规则就是标准流格式)。这一点与float恰恰相反。所以，即使子盒子均为浮动的盒子，如果对其中的一个盒子使用相对定位，它也同样是相对于它原本的float后的位置发生偏移。此时，他周围的float后的子盒子还仍然"以为"它还在原来的位置。

　　　　总结：position的relative不会影响标准流，它偏移后具体位置只有他自己清楚，其他盒子只能知道偏移之前的原本位置；而float则会影响自身的标准流格式，此时其他盒子也会知道。

2.　对于"绝对定位"【position：absolute；】

　　　　绝对定位的规律：

　　　　使用【position：absolute；】后偏移位置的基准与相对定位不同，是"距离它 最近 的一个 已经定位 的祖先元素"。所谓的已经定位是指该元素的position被设为非static的任意一种其他的方式。使用绝对定位后元素将从标准流中脱离，对父盒子可能存在影响，但对于后面的兄妹盒子的定位没有影响(会视为不存在)。特别地，如果没有设置偏移属性，那么元素将依旧保持在原来的位置。

　　　　总结：position的absolute会脱离标准流。还经常用于一种特殊情况：当希望元素脱离标准流，但又不希望改变位置时，可采用absolute。

3.　 对于"固定定位"【position：fixed；】

　　　　固定定位的规律：

　　　　与absolute类似，区别在于偏移位置的基准不同，它的基准是浏览器的窗口或者其他显示设备的窗口。