CSS是一種標記語言，它可以美化你的網站并為你的文本添加特殊效果。其中一種效果是把文字打在圖片上，這種方法非常實用且讓網站更加生動有趣。

.text-on-image {
position: relative;
}
.text-on-image:before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: url('your-image.jpg') center center no-repeat;
background-size: cover;
z-index: -1;
opacity: 0.9;
}
.text-on-image p {
position: absolute;
top: 20%;
left: 50%;
transform: translateX(-50%);
color: white;
font-size: 36px;
text-align: center;
}

如上所示，首先創建一個class（這里是text-on-image），然后使用position:relative使其成為容器，通過:before偽元素使用背景圖片，再通過將opacity屬性設置為小于1的值降低不透明度以達到文字顏色更加明亮的效果。最后是在class的子元素p屬性中添加內容和樣式以實現你所需要的效果。

這樣就可以輕松地將文字在圖片上添加，讓你的網站更加獨特、漂亮。