在使用 CSS 實現輪播圖時，很多人會使用圖片覆蓋的方式來實現，這種方法可以使輪播圖的切換更加自然流暢，同時也可以增加動畫效果。

要實現圖片覆蓋的效果，我們需要給輪播圖設置一個容器，并將圖片放在這個容器中。然后通過設置 CSS 來實現圖片覆蓋的效果。具體代碼如下：

// 設置輪播圖容器
.carousel {
position: relative;
width: 100%;
height: 400px; // 修改為實際高度
}
// 設置輪播圖中的圖片
.carousel img {
position: absolute;
top: 0;
left: 0;
opacity: 0;
transition: opacity .5s ease-in-out;
width: 100%;
height: 100%;
}
// 設置當前顯示的圖片
.carousel img.active {
opacity: 1;
}

以上代碼中，我們通過設置輪播圖容器的 position 屬性為 relative，然后再將圖片的 position 屬性設置為 absolute，使圖片脫離文檔流，并根據容器進行定位。接著，我們將圖片的 opacity 屬性設置為 0，使圖片處于隱藏狀態，當圖片被選中時，我們將其 opacity 屬性設置為 1，使其顯示在輪播圖中。

通過以上代碼，我們可以實現圖片覆蓋的效果。當輪播圖切換時，當前顯示的圖片 opacity 屬性從 1 變為 0，下一張圖片的 opacity 屬性從 0 變為 1，從而實現圖片的無縫切換。