CSS 絕對定位使元素相對于其最近的非靜態父元素定位。這意味著元素的位置不會受到其他元素的影響,并且可以根據父元素更改其位置。
.parent{ position: relative; } .child{ position: absolute; top: 50px; left: 100px; }
在上面的代碼中,父元素被設置成相對位置。這是因為子元素將根據其相對于父元素的位置進行定位。接下來,我們將子元素絕對定位并設置它的頂部和左側位置。
另一個重要的點是,如果沒有父級元素設置為相對定位,則子元素的位置將基于文檔的 body 元素。這通常不是我們想要的,因此有必要為子元素設置父級元素,如上面的代碼所示。
總之,CSS 絕對定位可以幫助我們完全控制元素的位置,并在頁面上創建獨特的布局。