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