應(yīng)該如何用css把文字換成圖片?

如果能把表現(xiàn)用(不重要的或者裝飾用的)的圖片全放在css中是最好的,因?yàn)檫@樣能夠輕易替換更新過的圖片,但卻不用更改標(biāo)記源代碼.同樣,我們也能確保所有瀏覽器和設(shè)備能正確解析標(biāo)記源代碼的意義,不管有沒有完全支持把文字替換成圖片的進(jìn)階css.在這本書中一直強(qiáng)調(diào)這樣的優(yōu)勢(shì).

沒有完美的解決方案

然而,尋找單純使用css將文字置換成圖片的"完美"方式幾乎跟尋找圣杯沒啥兩樣…因?yàn)楝F(xiàn)在還不存在.僅有能在所有瀏覽器中正常運(yùn)作的方法,但是它無(wú)法配合輔助程序(比如屏幕閱讀器)使用.還有其他能奏效的方法,除非使用者指定瀏覽器不顯示任何圖片,但又啟用css.

雖然在這段文字撰寫的時(shí)候還沒有能夠滿足所有人(或是所有使用者)的方法,但是這類方法現(xiàn)在的確有不少網(wǎng)站使用.在套用任何圖片置換法的時(shí)候都必須特別小心,同時(shí)也必須了解它會(huì)帶來(lái)的副作用.

能用,但是要小心

這就是本章的目的,屆時(shí)圖片置換帶來(lái)的便利性,但是相對(duì)的也會(huì)揭露它的缺點(diǎn),隨著時(shí)間的發(fā)展,或許會(huì)有更多css狂熱者發(fā)現(xiàn)能夠做出相同效果的更好方法;在那之前,我們必須善用其中的技巧,衡量得失.

為了讓你熟悉圖片置換的概念,讓我們看看幾種常用的方法.先從fahrner圖片替換技巧談起(fahrner image replacement;fir).