挺久沒用，有點忘了關於position這個屬性的用法，導致在練手的時候又犯了跟最開始新手才會犯的錯誤，那就是absolute和relative的用法。

在此首先看一下官方對這兩個屬性值的解釋：

position 屬性值的含義：

static

元素框正常生成。塊級元素生成一個矩形框，作為文件流的一部分，行內元素則會建立一個或多個行框，置於其父元素中。

relative

元素框偏移某個距離。元素仍保持其未定位前的形狀，它原本所佔的空間仍保留。

absolute

元素框從文件流完全刪除，並相對於其包含塊定位。包含塊可能是文件中的另一個元素或者是初始包含塊。元素原先在正常文件流中所佔的空間會關閉，就好像元素原來不存在一樣。元素定位後生成一個塊級框，而不論原來它在正常流中生成何種型別的框。

fixed

元素框的表現類似於將 position 設定為 absolute，不過其包含塊是視窗本身。

事實上預設的static和fixed這兩種情況是比較容易辨別的，而容易混淆的是relative和absolute。

用更簡單的說法就是absolute是將原本在文件流中所佔的位置去掉，並以第一個非static定位的父元素進行定位，一般這樣我們都會用top,left等來控制位置，這就是絕對定位。

而relative這種定位方式則是，在原有的文件流位置（也就是未設定POSITION屬性的時候的位置）基礎上移動。

所以當我們一般需要讓某些元素隨父元素移動而不會因為瀏覽器視窗大小變動而變形時，一般我們會把父元素定義為relative，而子元素定義為absolute，也就是說absolute是以第一個非static定位的父元素作為參考物件。

而一般我們會讓內容居中，讓margin：0 AUTO；就好了。

至於top和margin-top的區別，有些人可能分不清什麼時候用，經常會用margin-top來實現定位，事實上這種做法是錯誤的，margin它是外邊距，是佔內容的，往往用這個來勉強實現定位都會使其他元素位置改變或導致其他效果，而這個效果並非我們想要的。

所以要認清absolute和relative的區別和用法，加上TOP LEFT RIGHT BOTTOM來定位就可以減少錯誤了。

順帶一提，CSS3之後多了挺多新屬性的，自己還沒一個個看，暫時記一下，background-size:cover;這個是本身就有還是後來才有的？我用DW8的時候並沒有這個屬性提示；

另外CSS3有很多屬性IE是不能支援的，即使有那也是9甚至10以上才能相容，所以在寫的時候要注意瀏覽器的判斷，根據不同瀏覽器設計不同的樣式