CSS是前端開發(fā)不可或缺的一項技能。其中，三張圖片疊加是一個常見的效果，可以通過CSS的層疊和定位來實現(xiàn)。

.container {
position: relative;
width: 300px;
height: 300px;
}
.image {
position: absolute;
top: 0;
left: 0;
}
.image1 {
z-index: 1;
}
.image2 {
z-index: 2;
}
.image3 {
z-index: 3;
}

在上面的代碼中，我們首先創(chuàng)建了一個容器，將其定位為相對定位，并指定寬度和高度。接下來，我們定義了三個類名為image1、image2和image3的元素，分別代表了三張需要疊加的圖片。這些元素都設(shè)置為絕對定位，并設(shè)置了它們在容器中的位置。然后，使用z-index屬性來控制它們的層疊順序，值越大的元素將優(yōu)先展示。

接下來，讓我們看一下HTML代碼：

<div class="container"><img src="image1.png" class="image image1"><img src="image2.png" class="image image2"><img src="image3.png" class="image image3"></div>

在上面的代碼中，我們創(chuàng)建了一個div元素，并添加了三個img元素，它們的類名分別與CSS代碼中的類名相同。這樣就可以通過CSS代碼來控制這些元素的顯示順序，從而實現(xiàn)三張圖片的疊加效果。

總之，使用CSS來實現(xiàn)三張圖片疊加效果可以讓我們更加靈活地控制展示效果，并且能夠在一定程度上提高頁面的美觀度。