在網頁設計中，我們常常需要在圖片下方添加文字進行介紹，這時就需要用到CSS來實現文字居中顯示的效果了。

/* 圖片和文字容器 */
 .container {
position: relative; /* 相對定位 */
width: 200px;
 }
/* 圖片 */
 .container img {
width: 100%;
 }
/* 文字 */
 .container p {
position: absolute; /* 絕對定位 */
width: 100%;
text-align: center; /* 文字居中 */
bottom: 0; /* 距離底部0 */
 }

以上是實現圖片下方文字居中的CSS代碼，我們首先需要一個包含圖片和文字的容器，在CSS中將容器設為相對定位，然后將圖片設為100%寬度（即鋪滿整個容器），接著將文字設為絕對定位，并設置距離容器底部為0來撐開容器，最后將文字水平居中顯示即可。

如果需要對文字的樣式進行調整，可以在p標簽中添加相應的CSS屬性，如字體大小、顏色等。