CSS是一門常用的網頁開發語言，它可以使網頁看起來更加美觀。在CSS中，多個
元素可以相互層疊定位，從而呈現出不同的效果。
<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>在上面的例子中，我們使用了兩個DIV來演示CSS多個元素層疊定位的效果。第一個DIV的顏色為紅色，定位在頁面的左上角，而且z-index的值為3，因此它總是處于第二個DIV的前面。
另一個DIV的顏色為黃色，大小為200px x 200px，位置在第一個DIV下面的100px處，z-index的值為1。當我們打開頁面時，會發現紅色的DIV總是在黃色的DIV上面。
在CSS中，z-index控制元素的層疊順序。z-index的值越大，元素就越靠近頂部。如果兩個元素有相同的z-index值，那么它們的層疊順序將取決于它們在HTML文檔中的順序。
總之，使用CSS多個元素層疊定位可以創造出很多有趣的效果。為了更好地理解這個概念，我們可以在實踐中不斷嘗試不同的組合，從而獲得更多的經驗。