CSS是前端開發中的一項重要技術，它可以幫助我們實現許多漂亮的布局效果。其中之一就是圖片環繞布局，在這種布局中，文本內容可以自動圍繞在圖片周圍。本文將詳細介紹如何使用CSS實現這種效果。

img {
float: left; /* 設置圖片向左浮動 */
margin-right: 20px; /* 設置圖片右邊間距 */
}
p {
text-align: justify; /* 設置文本兩端對齊 */
}

上述代碼是實現圖片環繞布局的基本CSS代碼。我們首先使用float屬性讓圖片向左浮動，然后設置圖片右邊的間距為20px。接下來，我們使用text-align屬性將文本內容兩端對齊，這樣就可以圍繞在圖片周圍了。

需要注意的是，為了保證布局的穩定性，我們應該為圖片和文字設置合適的寬度。在需要環繞的圖片上設置合適的寬度可以確保文本不會覆蓋圖片，同時也能夠保證圖片不會變形。

除了基本的圖片環繞布局外，CSS還提供了許多其他的布局方式，例如可以讓文本在圖片的上面或下面，或者實現多個圖片環繞布局等等。只要我們熟練掌握了CSS的布局技巧，就可以輕松實現各種漂亮的效果。