使用CSS解決文字環(huán)繞圖片問(wèn)題的代碼
更新時(shí)間：2007年12月08日 23:05:28 作者：
上圖是美工為一站點(diǎn)制作的圖文并茂的新聞標(biāo)題列表，采用表格進(jìn)行布局，右上和下部分分布在兩個(gè)單元格中，程序?qū)崿F(xiàn)起來(lái)可不太容易：要么分兩次查詢，一次取4條，一次取5條；要么一次取出9條，再分在兩個(gè)單元格中顯示。能不能通過(guò)設(shè)置圖片的屬性，讓文字和圖片像Word中一樣可以四周環(huán)繞對(duì)齊？這樣程序就不用理會(huì)圖片，只負(fù)責(zé)一次讀取顯示就可以了。經(jīng)測(cè)試將圖片的float屬性設(shè)置為left可解決我們的問(wèn)題，效果如下圖：
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]
相關(guān)文章
div+css布局必須要知道的css條件注釋理論及實(shí)踐
div+css布局必須要知道的css條件注釋理論及實(shí)踐...2007-05-05
css創(chuàng)意ul+li實(shí)現(xiàn)的細(xì)線表格實(shí)現(xiàn)代碼
非常用創(chuàng)意的用ul+li實(shí)現(xiàn)的細(xì)線表格效果，不用table2008-08-08
使用text-align:justify實(shí)現(xiàn)兩端對(duì)齊一例
使用text-align:justify實(shí)現(xiàn)兩端對(duì)齊一例...2007-09-09
不用javascript實(shí)現(xiàn)帶序號(hào)的表格隔行換色的效果
這篇文章使用css實(shí)現(xiàn)隔行換色的方法，需要的朋友可以參考一下2007-11-11
XHTML標(biāo)簽的自關(guān)閉寫法的壞處分析
我們都知道XHTML里面的img標(biāo)記應(yīng)該這樣寫：<img alt="" src="" />，這種寫法也就是所謂的自關(guān)閉，在XML中是完全合法的寫法。2008-09-09
em px的關(guān)系...2007-01-01
Web Safe Color Pallette...2007-02-02
最近給所有的CSSer提出了一些寫CSS時(shí)候的“頂級(jí)技巧”。好多css使用技巧包括css縮寫，一行內(nèi)聲明css，分塊書寫代碼等實(shí)用技巧2008-04-04
就是將flash的參數(shù)，向下面的方法修改，即可解決2008-07-07
很多CSSer是從以前的網(wǎng)頁(yè)制作中開始學(xué)習(xí)CSS網(wǎng)頁(yè)布局的，或許還存在著一定的DW習(xí)慣。希望此文能幫助大家理解和糾正一些不好的習(xí)慣。2008-11-11