在CSS中，我們可以使用多種方法將文字添加到圖片上，以下是一些常見的方法：
1、使用***定位：
我們可以將文字元素***定位到圖片元素的上方，從而實現(xiàn)文字覆蓋圖片的效果。
```css
.image-with-text {
position: relative;
display: inline-block;
}
.image-with-text img {
display: block;
}
.image-with-text p {
position: absolute;
top: 0;
left: 0;
color: white;
}
```
```html
<div class="image-with-text">
<img src="path-to-image.jpg" alt="Image with text">
<p>這是一段添加到圖片上的文字</p>
</div>
```
2、使用偽元素：
我們可以使用偽元素（::before 或::after）在圖片元素的內(nèi)容前后插入文字。
```css
.image-with-text {
display: inline-block;
position: relative;
}
.image-with-text::before {
content: '這是一段添加到圖片上的文字';
position: absolute;
top: 0;
left: 0;
color: white;
}
.image-with-text img {
display: block;
}
```
```html
<div class="image-with-text">
<img src="path-to-image.jpg" alt="Image with text">
</div>
```
3、使用SVG：
我們可以將文字直接添加到SVG圖像中，這種方法需要一些額外的HTML和CSS來設(shè)置，但可以實現(xiàn)更復(fù)雜的效果。
```html
<svg class="image-with-text">
<image href="path-to-image.jpg" alt="Image with text" />
<text x="0" y="0" fill="white">這是一段添加到圖片上的文字</text>
</svg>
```
```css
.image-with-text text {
font-size: 24px;
}
```
是一些在CSS中將文字添加到圖片上的方法，你可以根據(jù)自己的需求選擇適合的方法，如果你需要更復(fù)雜的效果，可能需要結(jié)合HTML、CSS和JavaScript來實現(xiàn)。
