在網頁設計中，圖片與文字的搭配非常重要。在某些情況下，我們需要將文字居中放置在圖片的下方。那么在CSS中該怎么實現這個效果呢？ 首先我們需要創建一個HTML文件，然后在其中放入一張圖片和一段文字。代碼如下：

<div class="container">
<img src="myImage.jpg">
<p>這里是一段文字</p>
</div>

接下來，我們需要將圖片和文字包裹在一個父級容器內。這里我們給這個容器一個class名稱為“container”。 在CSS中，我們可以使用以下代碼實現圖片與文字的居中效果：

.container {
text-align: center; /* 將父級容器內的內容居中顯示 */
}
img {
display: block; /* 設置圖片為塊級元素，方便處理垂直居中 */
margin: 0 auto; /* 水平居中 */
}
p {
display: inline-block; /* 將段落轉換為內聯塊元素，方便處理垂直居中 */
vertical-align: middle; /* 垂直居中 */
}

首先，我們設置父級容器“container”內的內容居中顯示。然后，我們將圖片設置為塊級元素，并對其進行水平居中處理。接著，我們將段落轉換為內聯塊元素，并對其進行垂直居中處理。 需要注意的是，這種方法僅適用于圖片和文字的高度相等的情況。如果圖片與文字的高度不相等，我們可能需要使用其他方法來實現垂直居中效果。 綜上，通過CSS中的幾行代碼，我們可以輕松實現圖片下方居中顯示文字的效果。