在網(wǎng)頁設(shè)計(jì)中，經(jīng)常需要將文字與圖片進(jìn)行組合。有時(shí)候，我們希望圖片在文字的下面，這時(shí)候就需要使用 CSS 中的z-index屬性。

首先，我們需要將圖片的position屬性設(shè)置為absolute，這樣才能利用z-index。接著，設(shè)置圖片的z-index屬性為負(fù)數(shù)，值越小圖片越在底層。

img {
position: absolute;
z-index: -1;
}

同時(shí)，為了讓文字不會(huì)被圖片遮擋，我們需要給文字所在的容器設(shè)置相應(yīng)的padding值。

.container {
padding-top: 100px;
position: relative;
}

需要注意的是，使用z-index屬性時(shí)要確保所在容器的position屬性不為static，否則z-index會(huì)失效。

最后，我們來看一段完整的示例代碼：

<div class="container">
<p>這里是一段文字</p>
<img src="image.jpg" alt="圖片">
</div>
.container {
padding-top: 100px;
position: relative;
}
img {
position: absolute;
z-index: -1;
}

通過上面的 CSS 代碼，圖片就能夠在文字的下層了。