CSS是一種層疊樣式表語言，可以用于控制網頁的樣式，包括文字排版、顏色、大小、位置等。在網頁設計中，經常需要在圖片下方加上一行字，來說明圖片的內容或作用。下面就來介紹一下如何使用CSS在圖片下添加文字的方法。

img {
display: block; /* 將圖片轉換為塊級元素 */
margin-bottom: 10px; /* 圖片下方留出一定的空白 */
}
.caption {
text-align: center; /* 文字居中 */
font-size: 14px; /* 字體大小 */
margin-top: 5px; /* 文字與圖片之間的間隔 */
color: #333; /* 文字顏色 */
}

首先，我們將圖片轉換為塊級元素，這樣才能在圖片下方添加其他元素，比如文字。接著，我們給圖片設置一個下邊距，留出一定的空白。這樣可以使圖片與文字之間有一定的距離，避免過于擁擠。

然后，我們在HTML中添加一個類名為.caption的元素，在CSS樣式中設置該元素的樣式。我們讓文字居中顯示，設置文字大小為14px，設定一個5px的頂部邊距來與圖片分隔開來。我們還可以設定文字顏色，這樣可以讓文字與頁面背景有一定的對比度。

最后，我們只需要將文字節點添加到.caption元素中即可。代碼如下：

這是一張圖片的說明文字

我們使用一個div元素來裝載圖片及其說明文字。在div元素中，我們先放置img元素，然后再添加一個.caption的div元素來放置說明文字。這樣，說明文字就會在圖片下方居中顯示了。

總結一下，使用CSS在圖片下方添加文字可以使網頁更加美觀，易于閱讀。我們只需要將圖片轉換為塊級元素，采用一定的排版方式來設置文字的樣式，然后將文字添加到相應的位置即可。希望這篇文章對你有所幫助。