CSS 是一個很有用的工具，可以幫助我們在網頁上展示各種各樣的效果。其中有一個常見的需求就是將一些文字放到圖片上面。這不僅可以讓網頁看起來更有趣，而且也可以更好地展示出圖片的重要性。下面我們就來看看如何使用 CSS 實現文字到圖片上面的效果。

/*首先，我們需要一個包含圖片和文字的 HTML 結構*/
<div class="container">
<img src="image.jpg" alt="一張圖片">
<p>這是一段文字</p>
</div>
/*然后，在 CSS 中設置 container 的 position 屬性為 relative，將圖片的 position 屬性設置為 absolute，top 和 left 屬性都設為 0*/
.container {
position: relative;
}
.container img {
position: absolute;
top: 0;
left: 0;
}
/*最后，在 CSS 中設置文字的 position 屬性為 absolute，top 和 left 屬性都設為合適的值，并且 z-index 屬性要比圖片高，這樣文字才能在圖片上面顯示*/
.container p {
position: absolute;
top: 20px;
left: 20px;
z-index: 999;
}

這樣，就可以實現文字到圖片上面的效果了。當然，你也可以根據具體的需求來微調 CSS 的參數，達到更理想的效果。