CSS可以讓我們輕易地修改網頁元素的樣式和位置。其中一個應用CSS的用途就是在頁面上覆蓋元素。

覆蓋元素意味著一個元素可以完全覆蓋在另一個元素上方。使用CSS覆蓋元素可以幫我們達到很多目的，比如在一個彈出窗口上放一些內容，或者在廣告條上顯示一張圖片。

要覆蓋一個元素，我們需要使用CSS的“position”屬性。position屬性可以控制元素在頁面上的位置。

.element {
position: absolute;
left: 0;
top: 0;
z-index: 1;
}
.cover {
position: absolute;
left: 0;
top: 0;
z-index: 2;
}

在這個例子中，我們用position: absolute來把兩個元素定位在頁面上。我們使用z-index屬性來控制類.cover出現在類.element的上方。默認情況下，元素的z-index屬性為0。如果兩個元素有相同的z-index屬性，那么后面出現的元素會出現在前面的元素上方。如果一個元素的z-index屬性大于另一個元素，那么它會出現在另一個元素上方。

注意，使用“position: absolute”會讓元素脫離文檔流，并且不再占用空間。這也就意味著，如果你用這種方式覆蓋一個元素，你需要手動調整文檔流。你可以通過改變頁面上其他元素的位置，來避免被覆蓋元素覆蓋。

CSS覆蓋元素是平常開發中經常會用到的技巧。在使用的時候，一定要記得使用z-index屬性來控制元素的層級順序，以及下方的元素位置的調整。