CSS解決文字環(huán)繞圖片問題_CSS教程
教程Tag:暫無Tag,歡迎添加,賺取U幣!

上圖是美工為一站點制作的圖文并茂的新聞標題列表,采用表格進行布局,右上和下部分分布在兩個單元格中,程序實現(xiàn)起來可不太輕易:要么分兩次查詢,一次取4條,一次取5條;要么一次取出9條,再分在兩個單元格中顯示。能不能通過設置圖片的屬性,讓文字和圖片像Word中一樣可以四面環(huán)繞對齊?這樣程序就不用理會圖片,只負責一次讀取顯示就可以了。經測試將圖片的float屬性設置為left可解決我們的問題,效果如下圖:
| dnawo<div align="left"><img src="pic/20070404/014.jpg" width="91" height="84" style="float:left;" /> ·新聞標題列表<br> ·新聞標題列表<br> ·新聞標題列表<br> ·新聞標題列表<br> ·新聞標題列表新聞標題列表<br> ·新聞標題列表新聞標題列表<br> ·新聞標題列表新聞標題列表<br> ·新聞標題列表新聞標題列表<br> ·新聞標題列表新聞標題列表 </div> |
相關CSS教程:
- 相關鏈接:
- 教程說明:
CSS教程-CSS解決文字環(huán)繞圖片問題
。