在網(wǎng)頁(yè)設(shè)計(jì)中，我們常常需要在圖片下方添加文字進(jìn)行介紹，這時(shí)就需要用到CSS來(lái)實(shí)現(xiàn)文字居中顯示的效果了。

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

以上是實(shí)現(xiàn)圖片下方文字居中的CSS代碼，我們首先需要一個(gè)包含圖片和文字的容器，在CSS中將容器設(shè)為相對(duì)定位，然后將圖片設(shè)為100%寬度（即鋪滿整個(gè)容器），接著將文字設(shè)為絕對(duì)定位，并設(shè)置距離容器底部為0來(lái)?yè)伍_(kāi)容器，最后將文字水平居中顯示即可。

如果需要對(duì)文字的樣式進(jìn)行調(diào)整，可以在p標(biāo)簽中添加相應(yīng)的CSS屬性，如字體大小、顏色等。