在網頁中，常常需要在圖片上加上文字來起到講解、解釋的作用，同時也能讓網頁內容更加生動。下面我們來介紹如何使用 CSS 實現圖片內加文字。

.image{
position: relative;
}
.text{
position: absolute;
bottom: 0;
left: 0;
width: 100%;
background-color: rgba(0, 0, 0, 0.7);
color: #fff;
font-size: 14px;
padding: 10px;
}

首先，我們需要將圖片和文字的父元素設置為相對定位。

<div class="image">
<img src="example.jpg">
<div class="text">這是圖片描述文字</div>
</div>

接著，我們使用絕對定位將文字放到圖片的底部，左側，然后設置文字的寬度為 100%。我們還可以添加一個半透明的背景色和白色的文字顏色來使文字更加清晰可見。最后，我們可以設置文字的字號大小和內邊距，以適應不同的圖片大小和描述長度。

通過以上的 CSS 樣式和 HTML 代碼，我們可以輕松地實現圖片內加文字的效果，讓網頁內容更加生動、詳盡。