CSS圖片的覆蓋效果可以讓我們在頁面上顯示出兩張圖片中的一張，這種效果經常被用來制作鼠標懸停變換圖片的效果。

要實現圖片覆蓋效果，我們可以先用HTML代碼將兩張圖片放在一起，然后使用CSS對圖片進行樣式設置，具體實現方式可以使用background-image屬性和z-index屬性。

<div class="img-container">
<img src="image1.jpg">
<img src="image2.jpg">
</div>
.img-container {
position: relative;
}
.img-container img:last-child {
position: absolute;
top: 0;
left: 0;
z-index: -1;
}

上述代碼中，我們首先將兩張圖片放在一個div容器中，然后對整個容器設置position: relative屬性，這是因為我們需要將第二張圖片與第一張圖片重疊。

接下來，我們在CSS樣式中使用:last-child偽類選中div容器下的最后一張圖片，即第二張圖片，并將其設置為position: absolute屬性，將其定位到div容器的左上角。

最后，我們使用z-index屬性將第二張圖片的層級設置為-1，將其放到第一張圖片的下面，這樣就能達到圖片覆蓋的效果。