有話先說：本文的目的主要是向大家描述一下我們在遇見IE8版本一下以及Firefox相容的問題。 針對不同的瀏覽器寫不同的CSS的過程，這就叫CSS hack，也叫寫CSS hack，相信您會對一些比較不易解決的相容問題有一定的興趣。 註意點： 網上很多資料中常常把!important也作為 個hac ...
有話先說：本文的目的主要是向大家描述一下我們在遇見IE8版本一下以及Firefox相容的問題。
針對不同的瀏覽器寫不同的CSS的過程，這就叫CSS hack，也叫寫CSS hack，相信您會對一些比較不易解決的相容問題有一定的興趣。
註意點：
網上很多資料中常常把!important也作為 個hack 段，其實這是 個誤區。!important常常被我們 來更改樣式， 不是相容hack。造成這 個誤區的原因是IE6在某些情況下不主動識別!important,以 於常常被 誤 做識別IE6的hack。可是， 家註意 下，IE6只是在某些情況下 不識別（ie6下，同 個 括弧 對同 個樣式屬性定義，其中 個加important 則important標記是被忽略的，例：{background:red!important; background:green;} ie6下解釋為背景 green，其它瀏覽器解釋為背景 red；如果這同 個樣式在不同 括弧 定義，其中 個加important 則important發揮正常作 ，例：div{background:red!important} div{background:green}，這時所有瀏覽器統一解釋為背景色為紅色）
CSS HACK區別IE6、IE7、IE8、Firefox相容問題
1.區別IE和非IE瀏覽器
例：
#tip{ background:blue;/* IE背景藍 */ background:red\9;/*IE6、IE7、IE8背景紅 */ }
2.區別IE6,IE7,IE8,FF
區別符號：「\9」、「*」、「_」
例：#tip{ background:blue;/*Firefox背景變藍 */ background:red\9;/*IE8背景變紅色*/ *background:black;/*IE7背景變黑色*/ _background:orange;/*IE6背景變橘 */ }
說明：因為IE系列瀏覽器可讀「\9」， IE6和IE7可讀「*」( 字型大小)，另外IE6可辨識「_」(底線)，因此可以依照 順序寫下來，就會讓瀏覽器正確的讀取到 看得懂得CSS語法，所以就可以有效區分IE各版本和 IE瀏覽器(像是Firefox、Opera、GoogleChrome、Safari等)。
3.區別IE6、IE7、Firefox
區別符號：「*」、「_」
例：
#tip{ background:blue;/*Firefox背景變藍 */ *background:black;/*IE7背景變 */_background:orange;/*IE6背景變橘 */ }
說明：IE7和IE6可讀「*」( 字型大小)，IE6 可以讀「_」(底線)，但是IE7卻 法讀取「_」， 於Firefox( IE瀏覽 器)則完全 法辨識「*」和「_」，因此就可以透過這樣的差異性來區分IE6、IE7、Firefox
4.區別IE7、Firefox
區別符號：「*」、「!important」
例：
#tip{ background:blue;/*Firefox背景變藍 */ *background:green!important;/*IE7背景變綠 */ }
說明：因為Firefox可以辨識「!important」但卻 法辨識「*」， IE7則可以同時看懂「*」、「!important」， 因此可以兩個辨識符號來區隔IE7和Firefox。
5.區別IE6、IE7( 法1)
區別符號：「*」、「_」
例：
#tip{ *background:black;/*IE7背景變 */ _background:orange;/*IE6背景變橘 */ }
說明：IE7和IE6都可以辨識「*」( 字型大小)，但IE6可以辨識「_」(底線)，IE7卻 法辨識，透過IE7 法讀取「_」 的特性就能輕鬆區隔IE6和IE7之間的差異。
6.區別IE6、IE7( 法2)
區別符號：「!important」
例：
#tip{ background:black!important;/*IE7背景變 */ background:orange;/*IE6背景變橘 */ }
說明：因為IE7可讀取「!important;」但IE6卻不 ， CSS的讀取步驟是從上到下，因此IE6讀取時因 法辨識 「!important」 直接跳到下 讀取CSS，所以背景 會呈現橘 。
7.區別IE6、Firefox
區別符號：「_」 【 例】：
#tip{ background:black;/*Firefox背景變 */ _background:orange;/*IE6背景變橘 */ }
說明：因為IE6可以辨識「_」(底線)，但是Firefox卻不 ，因此可以透過這樣的差異來區隔Firefox和IE6，有效達 成CSShack。
總結：
希望這些HACK技術總結能夠幫到需要幫助的開發者。也希望大家不會再IE系列的相容問題上糾結的太多！
