在網頁設計中，圖片是不可或缺的元素，但是有時候單獨的圖片無法表達足夠的信息。這時候我們就需要在圖片下方插入文字來補充說明。 為了實現這個效果，我們需要使用CSS。具體實現方法如下： 1. 首先，我們需要在HTML中插入一張圖片，并用p標簽包裹要插入的文字。

<div class="image-text">
<img src="image.jpg" alt="圖片">
<p>這里是要插入的文字。</p>
</div>

2. 接下來，在CSS中對圖片的父元素進行樣式設置，使其以flex布局排列。

.image-text {
display: flex;
flex-direction: column;
align-items: center;
}

這里的display: flex;屬性使得圖片和文字可以根據父容器的高度自由排列。而flex-direction: column;屬性使元素在垂直方向上排列，也就是文字在圖片下方。 3. 然后，我們可以對圖片和文字分別進行樣式設置。這里的圖片樣式只是為了加個邊框，文字樣式設置了顏色和字號。

.image-text img {
border: 1px solid #ccc;
}
.image-text p {
color: #333;
font-size: 18px;
}

最后的效果如下圖所示：  通過這種方式，我們可以在網頁設計中輕松實現圖片下方插入文字的效果。