使用CSS給網頁中的圖片添加背景顏色，可以讓圖片更加有層次感和美觀。如果想要在背景顏色上再加上一些文字，可以通過一些簡單的CSS操作來實現。

首先，我們先通過CSS給圖片添加背景顏色：

img {
background-color: #ccc;
}

這段代碼將所有的圖片的背景顏色設置為灰色。

接下來，我們需要將圖片和文字放置在同一個元素中。可以使用div元素或者figure和figcaption等HTML標簽。

<div class="image-box">
<img src="example.jpg" alt="示例圖片">
<p>這是一段圖片描述文字。</p>
</div>

我們這里使用了一個帶有類名的div元素，其中包含了一個圖片和一段文字。接下來，我們可以對div元素應用CSS樣式，以實現圖片背景顏色浮在圖片上的效果：

.image-box {
position: relative;
}
.image-box img {
display: block;
}
.image-box p {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
background-color: rgba(0, 0, 0, 0.8);
color: #fff;
padding: 10px;
margin: 0;
}

這里，我們為div元素設置了相對定位，為

元素設置了絕對定位，使得文字可以在圖片上浮起來。我們還設置了文字的背景顏色為半透明黑色，顏色代碼為rgba(0, 0, 0, 0.8)，文字顏色為白色，填充和外邊距分別為10像素。通過這些樣式，我們就可以輕松實現圖片背景顏色浮在圖片上加文字的效果了。