CSS可以幫助我們控制圖片的環繞，讓網頁布局更加美觀。下面我們來介紹一下如何設置圖片的環繞效果。

img {
float: left; /* 設置圖片左浮動 */
margin: 10px; /* 設置圖片與文本之間的距離 */
}
p {
text-align: justify; /* 設置文本兩端對齊 */
margin: 10px; /* 設置文本與邊框之間的距離 */
padding: 10px; /* 設置文本與邊框之間的距離 */
border: 1px solid black; /* 給文本框加上邊框 */
}

上面的代碼使用了float屬性讓圖片左浮動，并設置了圖片與文本之間的距離。對于文本部分，我們可以使用text-align屬性將文本設置為兩端對齊，然后設置margin和padding屬性，讓文本與邊框之間保留一定的距離。最后使用border屬性給文本框加上邊框。

除了左浮動之外，我們還可以使用right屬性讓圖片右浮動，下面是對應的CSS代碼：

img {
float: right; /* 設置圖片右浮動 */
margin: 10px; /* 設置圖片與文本之間的距離 */
}
p {
text-align: justify; /* 設置文本兩端對齊 */
margin: 10px; /* 設置文本與邊框之間的距離 */
padding: 10px; /* 設置文本與邊框之間的距離 */
border: 1px solid black; /* 給文本框加上邊框 */
}

設置圖片環繞效果需要根據具體情況進行調整，比如調整圖片大小、距離、文本框大小等屬性，以保證布局效果更佳美觀。