上圖是美工為一站點製作的圖文並茂的新聞標題列表，採用表格進行佈局，右上和下部分分佈在兩個單元格中，程序實現起來可不太容易：要么分兩次查詢，一次取4條，一次取5條；要麼一次取出9條，再分在兩個儲存格中顯示。能不能透過設定圖片的屬性，讓文字和圖片像word中一樣可以四周環繞對齊？這樣程式就不用理會圖片，只負責一次讀取顯示就可以了。經測試將圖片的float屬性設為left可解決我們的問題，效果如下圖：
<div align="left"><img src=/upload/20071208230527665.gif style="max-width:90%" style="max-width:90%" style="float:left;" / alt="使用CSS解決文字環繞圖片問題的代碼_經驗交流" > ·新闻标题列表<br> ·新闻标题列表<br> ·新闻标题列表<br> ·新闻标题列表<br> ·新闻标题列表新闻标题列表<br> ·新闻标题列表新闻标题列表<br> ·新闻标题列表新闻标题列表<br> ·新闻标题列表新闻标题列表<br> ·新闻标题列表新闻标题列表 </div>
