在CSS設(shè)計中，有時我們需要在頁面中添加圖片，但是經(jīng)常會出現(xiàn)圖片與其他元素相互覆蓋的情況，這時我們就需要使用層疊來處理。

/* 以z-index屬性為例 */
img {
position: absolute;
top: 0;
left: 0;
z-index: 2; /* 使圖片位于最上面 */
}
div {
position: relative;
z-index: 1; /* 使div位于下層 */
}

在這個例子中，我們使用了z-index屬性來實現(xiàn)層疊。z-index屬性是用于控制元素在垂直方向上的顯示層次，數(shù)值越大，則越靠近頂部。如果兩個元素的z-index相同，則后面的元素會遮蓋前面的元素。

另外，要注意的是，在給元素添加z-index屬性之前，需要先給元素添加定位屬性（position）。

/* 以background-image屬性為例 */
div {
width: 500px;
height: 300px;
background-image: url(圖片路徑);
background-repeat: no-repeat;
background-position: center center;
}

除了使用z-index屬性外，我們也可以利用background-image屬性來添加背景圖片。當同時存在背景圖片和其他內(nèi)容時，我們也需要使用層疊來實現(xiàn)背景圖片與其他內(nèi)容的優(yōu)先級。

/* 以透明度為例 */
img {
opacity: 0.5;
}
div {
opacity: 1; /* 使div不透明 */
}
/* 或者使用rgba來設(shè)置透明度 */
div {
background-color: rgba(255, 255, 255, 0.5);
}

在這個例子中，我們使用了opacity屬性來設(shè)置元素的透明度。數(shù)值越小，則越透明。如果兩個元素的不透明度不同，則不透明的元素會覆蓋透明的元素。

總之，在CSS設(shè)計中，層疊是常用的一種技巧，可以解決在頁面中添加圖片時出現(xiàn)的各種問題。