CSS中的絕對定位與相對定位詳細介紹

層級關係為：

效果圖：

##為改變參照物（橘色框）後的效果

層級關係為：

效果圖：

#參考物為最頂級的元素情況。

層級關係為：

效果圖：

##僅使用margin屬性佈局絕對定位元素的情況

此情況，margin-bottom 和margin-right的值不再對文檔流中的元素產生影響，因為該元素已經脫離了文檔流。另外，不管它的祖先元素有沒有定位，都是以文檔流中原來所在的位置上偏移參照物。

圖9中，使用margin屬性佈局相對定位元素。
層級關係為：

效果圖：

IE6的情況下，box2前面沒有兄弟節點，則margin-left的值會出現雙倍邊距，見圖10。

層級關係為：

效果圖：

以上是CSS中的絕對定位與相對定位詳細介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章！