CSS中的“Hack”指的是為了解決不同瀏覽器之間差異性而使用的技術(shù)手段。由于不同廠商的瀏覽器實(shí)現(xiàn)標(biāo)準(zhǔn)的方式不盡相同,所以在同一份CSS樣式表下,不同瀏覽器的表現(xiàn)往往也不相同。
/* IE6 */ * html #header { background-image: url(bg-ie6.gif); } /* IE7 */ *:first-child+html #header { background-image: url(bg-ie7.gif); } /* IE8 */ @media \0screen\,screen\9{ #header { background-image: url(bg-ie8.gif); } } /* Safari */ @media screen and (-webkit-min-device-pixel-ratio:0){ #header { background-image: url(bg-safari.gif); } } /* Opera */ @media all and (-webkit-min-device-pixel-ratio:0) and (-o-min-device-pixel-ratio:5/4){ #header { background-image: url(bg-opera.gif); } }
上述代碼段展示了各個(gè)瀏覽器下針對(duì)背景圖片設(shè)置的Hack技巧。例如,由于IE6無(wú)法解析“>”后代選擇器,所以需要使用星號(hào)Hack來(lái)使其生效。
需要注意的是,Hack越多,代碼越難以維護(hù)。為此,建議在編寫樣式時(shí)盡可能避免使用Hack,采用通用的解決方案,以減少不必要的代碼復(fù)雜度和混亂。