在CSS中，將文字浮到圖片上是一個(gè)常見的需求，要實(shí)現(xiàn)這一效果，可以使用CSS的position屬性以及z-index屬性，以下是一個(gè)簡(jiǎn)單的示例，展示如何將文字浮到圖片上：

1、創(chuàng)建一個(gè)HTML文件，包含圖片和要浮在圖片上的文字。

<div class="image-container">
  <img src="your-image-url" alt="Your Image">
  <div class="text-over-image">Your Text</div>
</div>

2、使用CSS來設(shè)置圖片和文字的樣式。

.image-container {
  position: relative; /* 確保圖片和文字都可以被定位 */
  width: 300px; /* 你可以根據(jù)需要設(shè)置圖片的寬度 */
  height: 200px; /* 你可以根據(jù)需要設(shè)置圖片的高度 */
}
.image-container img {
  width: 100%; /* 圖片寬度設(shè)置為100%，以適應(yīng)容器寬度 */
  height: 100%; /* 圖片高度設(shè)置為100%，以適應(yīng)容器高度 */
}
.text-over-image {
  position: absolute; /* 文字***定位在圖片上方 */
  top: 0; /* 文字距離圖片頂部的距離為0 */
  left: 0; /* 文字距離圖片左邊的距離為0 */
  z-index: 1; /* 文字位于圖片之上 */
}

在這個(gè)示例中，.image-container元素設(shè)置為相對(duì)定位，這樣其內(nèi)部的圖片和文字都可以被定位，圖片的寬度和高度設(shè)置為100%，以適應(yīng)容器的寬度和高度，文字元素設(shè)置為***定位，位于圖片的上方，并且使用z-index屬性確保文字位于圖片之上。