CSS是一門常用的網(wǎng)頁開發(fā)語言，它可以使網(wǎng)頁看起來更加美觀。在CSS中，多個(gè)
元素可以相互層疊定位，從而呈現(xiàn)出不同的效果。
<style type="text/css">
#div1 {
width: 300px;
height: 100px;
background-color: red;
position: absolute;
top: 50px;
left: 50px;
z-index: 3;
}
#div2 {
width: 200px;
height: 200px;
background-color: yellow;
position: absolute;
top: 100px;
left: 100px;
z-index: 1;
}
</style>
<body>
<div id="div1"></div>
<div id="div2"></div>
</body>在上面的例子中，我們使用了兩個(gè)DIV來演示CSS多個(gè)元素層疊定位的效果。第一個(gè)DIV的顏色為紅色，定位在頁面的左上角，而且z-index的值為3，因此它總是處于第二個(gè)DIV的前面。
另一個(gè)DIV的顏色為黃色，大小為200px x 200px，位置在第一個(gè)DIV下面的100px處，z-index的值為1。當(dāng)我們打開頁面時(shí)，會發(fā)現(xiàn)紅色的DIV總是在黃色的DIV上面。
在CSS中，z-index控制元素的層疊順序。z-index的值越大，元素就越靠近頂部。如果兩個(gè)元素有相同的z-index值，那么它們的層疊順序?qū)⑷Q于它們在HTML文檔中的順序。
總之，使用CSS多個(gè)元素層疊定位可以創(chuàng)造出很多有趣的效果。為了更好地理解這個(gè)概念，我們可以在實(shí)踐中不斷嘗試不同的組合，從而獲得更多的經(jīng)驗(yàn)。