在網頁設計中，疊加圖片是一種很常見的操作，讓圖片更具有視覺效果。今天我們來學習如何使用CSS疊加兩個圖片。

/* HTML代碼 */
<div class="box">
<img src="picture1.jpg">
<img src="picture2.jpg">
</div>
/* CSS代碼 */
.box {
position: relative;
}
.box img:first-child {
position: relative;
z-index: 1;
}
.box img:last-child {
position: absolute;
top: 0;
left: 0;
z-index: 2;
}

以上代碼中，我們首先在一個div容器中放置兩個圖片，然后利用position屬性來控制它們的位置及層級。

其中，.box的position屬性為relative，是為了讓這個div容器能夠作為疊加圖片的定位父級。接著，我們用:first-child選擇器來選中第一個圖片，設置它的position為relative，這樣它就能夠被后面的圖片遮蓋。

:last-child選擇器選中最后一個圖片，將它的position屬性設為absolute，使它脫離文檔流，并用top和left屬性讓它和div容器重合。最后設置z-index屬性，讓它的層級高于第一個圖片，達到疊加的效果。

以上就是疊加兩個圖片的方法，希望能對你有所幫助。