CSS在網頁設計中是一個重要的工具，它可以幫助我們實現各種不同的效果。其中，文字圖片環繞是一個經典的案例。接下來，我將通過實例來講解如何使用CSS實現文字圖片環繞。

首先，我們來看一下HTML部分的代碼：

<div class="wrapper">
<img src="https://example.com/image.jpg" alt="image">
<p>這是一段文字，我們將使用CSS來實現圖片環繞效果。</p>
<p>這也是一段文字。</p>
</div>

這里我們使用了一個wrapper類來包裹圖片和文字。現在我們開始為這個wrapper類編寫CSS代碼：

.wrapper {
overflow: auto;
}
.wrapper img {
float: left;
margin: 0 10px 10px 0;
}

首先，我們將wrapper類的overflow屬性設置為auto，這可以確保圖片和文字之間產生合適的間距。接下來，我們將圖片的浮動設置為左邊，并且將右側和下方的邊距分別設置為10像素和0像素。這樣，圖片就會排在文字的左邊，并且與文字之間產生一定間距。

現在我們再來看看效果圖：

通過這個案例，我們可以看到CSS是多么強大。通過合理使用CSS，我們可以實現各種我們想要的效果。