CSS圖片在文字下是網(wǎng)頁設(shè)計中常見的布局方式，可以有效地增加網(wǎng)頁的美觀度和信息量。下面將介紹如何實現(xiàn)這種布局。

img {
float: left;
margin-right: 10px; /*設(shè)置圖片的右側(cè)外邊距，使文本能夠環(huán)繞在圖片周圍*/
}

在上面的代碼中，我們首先為圖片添加了浮動屬性，并設(shè)置了右側(cè)外邊距，這樣文本就能夠環(huán)繞在圖片周圍。

.clearfix::after {
content: "";
clear: both;
display: block;
}

為了避免圖片對其他元素的影響，我們還需要使用clearfix清除浮動影響。

在HTML中，我們的代碼應(yīng)該如下所示：

<div class="clearfix">
<img src="example.jpg">
<p>這是一段文字，用以演示在圖片下的文本布局。這是一段文字，用以演示在圖片下的文本布局。</p>
</div>

在這段代碼中，我們把圖片和文字都包含在了一個帶有clearfix類的div元素中，這樣就能夠保證圖片和文字不會對其他元素產(chǎn)生影響。

這就是CSS圖片在文字下的布局方式，希望對你有所幫助。