在使用CSS樣式表設(shè)計(jì)網(wǎng)頁(yè)時(shí),常常會(huì)遇到CSS樣式表無(wú)法正確識(shí)別png格式圖片的問(wèn)題。
這個(gè)問(wèn)題的根源在于不同的瀏覽器對(duì)png格式圖片的支持程度不同。其中,舊版的IE瀏覽器無(wú)法正確識(shí)別png格式圖片,而新版的IE瀏覽器對(duì)png格式圖片的支持程度又不如其他瀏覽器。
為了解決這個(gè)問(wèn)題,我們可以使用CSS樣式表中的hack語(yǔ)法。Hack語(yǔ)法是指通過(guò)一定的方式讓特定的CSS樣式只在特定的瀏覽器中生效。例如:
img{ /*針對(duì)IE瀏覽器的hack語(yǔ)法*/ *behavior:url(iepngfix.htc); /*針對(duì)其它瀏覽器的PNG透明*/ background:none!important; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true', sizingMethod='crop', src='images/test.png'); }
上述代碼中的hack語(yǔ)法可以讓老版的IE瀏覽器通過(guò)特定的行為文件來(lái)識(shí)別png格式圖片,而新版的IE瀏覽器則通過(guò)filter屬性實(shí)現(xiàn)。同時(shí),也保證了其他瀏覽器能正確識(shí)別PNG格式圖片。
盡管hack語(yǔ)法能夠解決這個(gè)問(wèn)題,但它并不是一種優(yōu)秀的解決方案。因?yàn)閔ack語(yǔ)法的可讀性、可維護(hù)性都較差,同時(shí)也存在兼容性問(wèn)題。
因此,在設(shè)計(jì)網(wǎng)頁(yè)時(shí),我們應(yīng)該優(yōu)先選擇JPEG或GIF格式的圖片,這兩種格式幾乎被所有瀏覽器支持。當(dāng)然,如果需要使用PNG格式圖片,我們也應(yīng)該使用hack語(yǔ)法來(lái)保證其在各大瀏覽器上的顯示效果。