CSS 是一種用于網頁排版的樣式表語言，可以讓我們更好地控制網頁的外觀和樣式。在使用 CSS 時，經常需要將多張圖片疊加在一起，以實現特殊的視覺效果。本文將介紹如何使用 CSS 將圖疊加在一起。 首先，我們需要準備兩張圖片。在 HTML 中使用 img 標簽來引入這兩張圖片：

<img src="image1.png" alt="Image 1">
<img src="image2.png" alt="Image 2">

在 CSS 中，我們可以使用 position 屬性和 z-index 屬性來將圖片疊加在一起。position 屬性可以指定一個元素的定位方式，包括 static、relative、absolute 和 fixed。z-index 屬性可以指定元素在垂直方向上的顯示層級。 下面是一個使用 position 和 z-index 屬性將兩張圖片疊加在一起的例子：

<style>.img {
position: relative;
margin: 50px;
}
.img img:first-child {
position: absolute;
top: 0;
left: 0;
z-index: 1;
}
.img img:last-child {
position: absolute;
top: 20px;
left: 20px;
z-index: 2;
}
</style><p class="img"><img src="image1.png" alt="Image 1"><img src="image2.png" alt="Image 2"></p>

在上面的例子中，我們為包含兩張圖片的 p 元素設置了相對定位，使其中的 img 元素能夠相對于它們的父元素進行定位。然后，我們使用選擇器 :first-child 和 :last-child 分別為第一張圖片和第二張圖片指定了絕對定位，同時給它們不同的 z-index 值，使第二張圖片在第一張圖片上方顯示。 通過控制圖片的定位和 z-index 屬性，我們可以將多張圖片疊加在一起，實現更加豐富的視覺效果。 以上就是使用 CSS 將圖疊加在一起的方法。需要注意的是，為了達到最好的效果，我們應該在使用 position 和 z-index 屬性時，仔細考慮好每個元素的定位和層級關系，以免出現布局混亂或遮擋的問題。