在網頁設計中，經常需要將文字與圖片進行配合，讓網站更加美觀和有吸引力。其中一種比較流行的設計方式是將圖片置于文字上方，這樣能夠突出圖片的重要性，同時不會影響到文字內容。在實現這個效果時，CSS提供了一種簡單的方法。 首先，在HTML中定義一個div，并設置它的寬度和高度。我們把這個div作為圖片的容器，用來顯示圖片。接下來，在這個div中插入一張圖片。為了設置圖片置于文字上方的效果，我們使用CSS中的z-index屬性。這個屬性可以用來控制元素在層疊的時候的顯示順序。值較大的元素會顯示在值較小的元素之上。 下面是一個簡單的實現代碼：

這里是描述文字。

在這個代碼中，我們首先定義了一個類名為image-container的div，并將它的position設置為relative。接下來，我們為這個div中的img元素設置position為absolute，并將top和left都設置為0，這樣就能夠將圖片放到最上面。同時，我們也將img的z-index設置為1，因為我們希望它在層疊的時候處于最上面。 在div中插入了一個段落元素p，用來顯示描述文字。由于我們希望這個文字在圖片之上顯示，因此設置了它的position為relative，并將它的z-index設置為2，這樣就能夠確保它在層疊的時候處于圖片的上方。 通過這樣的設置，我們就能夠實現圖片置于文字上方的效果。在實際的網頁設計中，我們可以使用相應的樣式來實現更加復雜和精美的效果。