在CSS中，我們可以使用多種方式給圖片按鈕添加文字，以下是一種常見的方法：

我們需要?jiǎng)?chuàng)建一個(gè)包含圖片和文字的元素，可以使用HTML的div元素或者button元素來實(shí)現(xiàn)。

<div class="image-button">
  <img src="image.png" alt="圖片按鈕">
  <span>按鈕文字</span>
</div>

或者：

<button class="image-button">
  <img src="image.png" alt="圖片按鈕">
  <span>按鈕文字</span>
</button>

我們可以使用CSS來樣式化這個(gè)元素，使得文字出現(xiàn)在圖片按鈕的上方或者下方。

.image-button {
  position: relative;
  width: 100px;
  height: 100px;
}
.image-button img {
  width: 100%;
  height: 100%;
}
.image-button span {
  position: absolute;
  top: 0; /* 或者 bottom: 0; */
  left: 0;
  width: 100%;
  height: 20px; /* 或者 height: 50px; */
  background-color: rgba(255, 255, 255, 0.7); /* 可選 */
  border: 1px solid #000; /* 可選 */
  border-radius: 5px; /* 可選 */
  text-align: center;
  line-height: 20px; /* 或者 line-height: 50px; */
}

在這個(gè)例子中，我們使用了position: relative;來使得圖片按鈕元素相對于其正常位置進(jìn)行定位，我們使用position: absolute;來使得文字元素相對于圖片按鈕元素進(jìn)行定位，通過調(diào)整top、left、width、height等屬性，我們可以控制文字在圖片按鈕上的位置，我們還可以添加一些樣式來美化文字，比如設(shè)置背景色、邊框、邊框圓角等。