詳解Position屬性四個值：static、fixed、relative、absolute的差異與用法

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進行層次分級。

 

z-index 屬性設定元素的堆疊順序。擁有較高堆疊順序的元素總是會處於堆疊順序較低的元素的前方。即屬性值大的堆疊在屬性值小的元素上面，不過前提條件是同級元素（註釋：Z-index 僅能在定位元素上奏效，元素可擁有負的z-index 屬性值。

以上是詳解Position屬性四個值：static、fixed、relative、absolute的差異與用法的詳細內容。更多資訊請關注PHP中文網其他相關文章！