在CSS中，可以使用position屬性將文字疊加在圖片上，以下是一個示例：

<div class="image-with-text">
  <img src="image.jpg" alt="背景圖片">
  <div class="text">
    <p>這是一段文字，它會在圖片上顯示，而不會單獨顯示出來，這是因為我們將文字包裹在一個div中，并將其位置設置為***定位，使其始終在圖片的中心位置，即使圖片的尺寸發(fā)生變化，文字也會始終保持在中心位置，不會受到任何影響，這種方法非常適合在圖片上顯示標題、標語或任何需要疊加在圖片上的文字，它不僅可以增加圖片的吸引力，還可以提高圖片的可讀性和可訪問性。
  </div>
</div>

.image-with-text {
  position: relative;
  width: 300px;
  height: 200px;
}
.image-with-text img {
  width: 100%;
  height: 100%;
}
.image-with-text .text {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #ffffff;
  font-size: 24px;
}

在這個示例中，我們首先將image-with-text容器的位置設置為相對定位，然后將其尺寸設置為300x200像素，我們將圖片的尺寸設置為100%，使其填充整個容器，我們將文本的位置設置為***定位，并使用transform屬性將其移動到圖片的中心位置，這種方法可以確保文本始終在圖片的中心位置，無論圖片的尺寸如何變化。