CSS 是前端開發中必不可少的一部分，可以通過 CSS 為網頁添加各種樣式和效果。在很多網站中，我們會看到為了美觀和易辨識度，經常會把文字放在圖片上。在這個情況下，我們就需要了解如何在圖片上添加文字。

要想在圖片上添加文字，需要利用 CSS 中的屬性：background-image 和 background-clip。其中，background-image 用來設置背景圖片，background-clip 用來控制背景的顯示區域。

.text-on-image {
background-image: url("./image.png"); /* 設置背景圖片 */
background-clip: text; /* 控制背景的顯示區域 */
-webkit-background-clip: text; /* Safari和Chrome瀏覽器需要添加此屬性 */
color: transparent; /* 取消文字顏色（使得文字不可見） */
}

上述代碼中，我們給一個類名為 text-on-image 的 HTML 元素設置了背景圖片并將背景的顯示區域設置為文字所在的區域。最后，我們取消了文字顏色，使得文字不可見，此時就可以看到背景圖片上出現了我們所需要的文字。

不過需要注意的是，這種做法雖然能夠實現把文字打在圖片上的效果，但是不利于搜索引擎的識別和用戶的可訪問性。因此，在實際項目中，需要根據具體情況選擇合適的方案。