在CSS中，您可以通過多種方式在圖片上添加文字，以下是一種常見的方法：

1、您需要在HTML中創(chuàng)建一個包含圖片和文字的容器。

<div class="image-container">
    <img src="path/to/your/image.jpg" alt="Your Image">
    <p class="image-text">Your Text</p>
</div>

2、在CSS中，您可以設(shè)置容器的樣式，以便文字顯示在圖片的上方或下方。

.image-container {
    position: relative;
    width: 300px;
    height: 200px;
}
.image-container img {
    width: 100%;
    height: 100%;
}
.image-text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    color: #fff; /* 設(shè)置文字顏色 */
    z-index: 1; /* 確保文字顯示在圖片上方 */
}

3、在上述代碼中，.image-container容器設(shè)置為相對定位，而.image-text元素設(shè)置為***定位，通過調(diào)整top和left屬性，您可以控制文字在圖片上的位置。z-index屬性用于確保文字顯示在圖片上方。

4、您還可以根據(jù)具體需求調(diào)整文字的樣式，如顏色、字體大小等。

.image-text {
    color: #f00; /* 設(shè)置為紅色 */
    font-size: 24px; /* 設(shè)置為24號字體 */
}

5、您可以在瀏覽器中查看效果，如果需要對文字位置進行微調(diào)，可以使用JavaScript來調(diào)整.image-text元素的樣式。

var textElement = document.querySelector('.image-text');
textElement.style.top = '10px'; // 調(diào)整文字距離圖片頂部的距離

希望這些方法能幫助您在CSS中輕松添加圖片上的文字。