CSS Hack

      說到瀏覽器兼容性問題，就必須說CSS Hack！

 

      在CSS中，Hack是指一種兼容CSS在不一樣瀏覽器中正確顯示的技巧方法。說的更直白一些就是，你平時作個頁面，佈局正確，CSS正確，可就是在不一樣的瀏覽器中顯示的效果不同，要麼錯位，要麼多幾個像素，怎麼都找不到緣由，這時候咱們就會用一些技巧方法來讓不一樣的瀏覽器顯示同樣的效果，這種方法咱們就稱之爲CSS Hack。

     CSS Hack是經過不一樣的標記來區分不一樣的瀏覽器。

 

①!important 做用：用來解決一些在IE6上顯示的效果與IE7/IE8/IE9/FireFox上的效果不同的狀況。好比有下面的一段代碼：

#content{
     height:960px !important;
     height:900px;
}

IE7/IE8/IE9/FireFox能夠識別上面附加"!important"的語句，看到附加"!important"的語句後，就不會再去執行第二句，儘管他們也「認識」第二句，可是附加"!important"的語句擁有絕對優先級，只要有它存在，第二句就不容許執行。附加「!important」語句IE6沒法識別，因此IE6會跳過附加「!important」的語句直接去執行第二句「height:900px」,第一句在IE6看來就是不存在的語句。

      利用瀏覽器對加了"!important"語句的識別能力，來解決一些在IE6上顯示的效果與IE7/IE8/IE9/FireFox上的效果不同的狀況。

②*(星號)

做用：用來解決一些在IE6/IE7上顯示的效果與IE8/IE9/FireFox上的效果不同的狀況。好比有下面的一段代碼：

#content{
     height:960px;
    *height:900px;
}

IE8/IE9/FireFox不能識別附加有*的CSS屬性語句，因此IE8/IE9/FireFox只能讀第一句「height:960px;」而忽略第二句，IE6/IE7能夠識別附加有*的CSS屬性語句，也就是說第一句和第二句都認識，因此它們先讀第一句，將高度定爲960px，然後又讀第二句「*height:900px;」，將高度從960px修改成900px，因此咱們在IE中看到的最終效果就是高度爲900px;

       利用瀏覽器對加了「*」語句的識別能力，來解決一些在IE6/IE7上顯示的效果與IE8/IE9/FireFox上的效果不同的狀況。

 

 

補充：

IE6能識別下劃線"_"和星號" * "，IE7能識別星號" * "，但不能識別下劃線"_"，IE8能識別" \9"，但不能識別下劃線"_"，而firefox兩個都不能認識,卻能夠識別‘!important’.