[TOC]
### relative與absolute的主要區別
~~~
1. relative定位的層總是相對于其最近的父元素,無論其父元素是何種定位方式。
2. absolute定位的層總是相對于其最近的定義為absolute或relative的父層,而這個父層并不一定是其直接 父層。如果其父層中都未定義absolute或relative,則其將相對body進行定位
~~~
### position的屬性:
~~~
1、static(靜態定位):默認值。沒有定位,元素出現在正常的流中(忽略 top, bottom, left, right 或者 z-index 聲明)。
2、relative(相對定位):生成相對定位的元素,通過top,bottom,left,right的設置相對于其正常(原先本身)位置進行定位。可通過z-index進行層次分級。
3、absolute(絕對定位):生成絕對定位的元素,相對于 static 定位以外的第一個父元素進行定位。元素的位置通過 “left”, “top”, “right” 以及 “bottom” 屬性進行規定。可通過z-index進行層次分級。
4、fixed(固定定位):生成絕對定位的元素,相對于瀏覽器窗口進行定位。元素的位置通過 “left”, “top”, “right” 以及 “bottom” 屬性進行規定。可通過z-index進行層次分級。
~~~
### 總結
~~~
如果用position來布局頁面,父級元素的position屬性必須為relative,而定位于父級內部某個位置的元素,最好用 absolute,因為它不受父級元素的padding的屬性影響,當然你也可以用position,不過到時候計算的時候不要忘記padding的值
~~~