在網頁設計中，圖片是不可或缺的元素，而 CSS 又是網頁設計中必不可少的技術之一。在網頁中嵌套圖片已經很常見了，但是在圖片上面再加入另外一張圖片則需要一些特別的技巧。

.example {
position: relative;
}
.example img {
display: block;
width: 100%;
height: auto;
}
.example:before {
content: "";
position: absolute;
top: 0;
left: 0;
background-image: url("圖片地址");
background-repeat: no-repeat;
background-size: cover;
width: 100%;
height: 100%;
z-index: -1;
}

上述代碼中，我們首先將外層元素設置為相對定位，這樣添加的內部元素才可以根據其位置進行定位。然后我們設置內部的img元素為塊級元素，使其占滿整個父元素的寬度，同時高度自適應。

接著我們使用:before偽元素來添加另一張圖片，這張圖片會被設置為絕對定位，由于使用了z-index屬性，所以這張圖片會被放在原來的圖片之下。我們使用background-image來設置這張圖片的地址，background-repeat來設置背景圖片不重復，使用background-size來使圖片占滿整個父元素。最后設置寬和高都為100%來鋪滿整個父級元素。

使用上述代碼，我們就可以在一個圖片上面再加上另外一張圖片，達到更好的設計效果。這種技巧可以用于設計網頁中的背景圖案或者是界面的裝飾圖案。