position

position:absolute——绝对定位元素，脱离了文本流（即在文档中已经不占据位置）。
一、absolute定位必须指定 left ， right ， top ， bottom 属性中的至少一个，在没有设定TRBL值时元素的位置听从正常的HTML布局规则。
二、设定TRBL时，以最近有position定位(relative、absolute、fixed)的先级元素为原点（没有这样的先级元素则以浏览器左上角为原点）进行定位。
三、position:absolute会使元素会自动变为以 display:inline-block 的方式显示。

详见position:absoulate demo

 

position:relative——相对定位,就是相对于元素自己在文档中应该出现的位置来移动这个元素,经过TRBL来移动元素的位置(实际上该元素依然占据文档中原有的位置，只是视觉上相对原来的位置有移动)。
一、原来的位置仍是被它占着（你看上面的红色Div并无向上移动挨着蓝色Div，就是这个缘由），其它元素不能占有它的位置。

详见position:relative demo

 

position:fixed——固定定位，与absolute定位类型相似，但它始终以是视图（屏幕内的网页窗口）左上角为原点进行移动，由于网页窗口是固定的，因此它不会随浏览器滚动条的滚动而变化。
一、IE6不支持此属性。
二、用position:absolute+js能够解决IE6的兼容问题(如在ie6-position-fixed.css中用js动态算top的高度)。

详见position:fixed demo