CSS疊加(又稱疊層)可以讓一個元素在其它元素之上。在HTML頁面中,如果一個元素的位置設置為absolute或fixed,那么這個元素就可以使用z-index屬性進行疊加。z-index屬性越大,元素就越靠近觀察者。
使用z-index屬性時,最好保持所有需要疊加的元素都在同一個樣式表中(不同的樣式表可能會發生沖突)。下面是一個例子:
.box1{ position: absolute; top: 20px; left: 20px; z-index: 1; } .box2{ position: absolute; top: 50px; left: 50px; z-index: 2; }
在這個例子中,.box2會疊在.box1之上,因為它的z-index值比.box1大。如果兩個元素的z-index值相等,它們就會按照它們在HTML文檔中的順序來疊加。
需要注意的是,在使用z-index時,浮動元素有時會表現出意外的行為。為了避免出現這種情況,建議在元素上使用position屬性,而不是浮動屬性。
上一篇css 只要上邊框
下一篇css3按鈕邊框特效