關於CSS Hack

        因爲不一樣廠商的瀏覽器，好比Internet Explorer,Safari,Mozilla Firefox,Chrome等，或者是同一廠商的瀏覽器的不一樣版本，如IE6和IE7，對CSS的解析認識不徹底同樣，致使生成的不是咱們所須要的頁面效果。 這個時候咱們就須要針對不一樣的瀏覽器去寫不一樣的CSS，讓它可以同時兼容不一樣的瀏覽器，在不一樣的瀏覽器中也能獲得咱們想要的頁面效果。

        簡單的說，CSS hack的目的就是使你的CSS代碼兼容不一樣的瀏覽器。固然，咱們也能夠反過來利用CSS hack爲不一樣版本的瀏覽器定製編寫不一樣的CSS效果。

        啥？還木明白？就是說同一個效果你要根據不一樣的瀏覽器寫不一樣的css 代碼！如今主要就是針對IE瀏覽器了。

        原理：使用CSS屬性的優先級來實現CSS Hack。

        CSS Hack書寫順序，通常是將適用範圍廣、被識別能力強的CSS定義在前面。

        CSS Hack的實現方式：

一、CSS 類內部Hack

        經過 屬性和值的前綴或後綴來實現瀏覽器版本的識別。

        例如 IE6能識別下劃線"_"和星號" * "，IE7能識別星號" * "，但不能識別下劃線"_"，IE6~IE10都認識"\9"，但firefox前述三個都不能認識。

二、選擇器Hack

        在 瀏覽器前加前綴來實現不一樣的瀏覽器版本的識別。

    * : 識別IE6

    *+ 前綴： 識別IE7

        ex:

        *div{

        

         }

三、HTML頭部引用Hack(掌握)

 原理：使用 IE的條件註釋來完成瀏覽器版本的判斷(注：IE10+已經再也不支持條件註釋)。

語法：

<!--[if 條件 IE 版本]>

知足瀏覽器版本時要執行的操做

<![endif]-->

版本：6-10，若是省略版本號的話，則判斷是否爲IE

<!--[if IE 6]>

只在IE6中要執行的操做

<![endif]-->

條件：

一、gt

判斷當前瀏覽器版本是否大於指定版本

二、gte

判斷當前瀏覽器版本是否大於等於指定版本

三、lt

判斷當前瀏覽器版本是否小於指定版本

四、lte

判斷當前瀏覽器版本是否小於等於指定版本

五、!

非，取反，不是

判斷當前瀏覽器版本是否不等於指定版本

六、不寫

判斷瀏覽器是否爲IE或IE的指定版本

CSS hack利弊

        通常狀況下，咱們儘可能避免使用CSS hack，可是有些狀況爲了顧及用戶體驗實現向下兼容，不得已才使用hack。好比因爲IE8及如下版本不支持CSS3,而咱們的項目頁面使用了大量CSS3新屬性在IE9/Firefox/Chrome下正常渲染，可能就得讓IE8-的專屬hack出馬了。使用hack雖然對頁面表現的一致性有好處，但過多的濫用會形成html文檔混亂不堪，增長管理和維護的負擔。相信只要你們一塊兒努力，少用、慎用hack，將來必定會促使瀏覽器廠商的標準愈來愈趨於統一，順利過渡到標準瀏覽器的主流時代。拋棄那些陳舊的IE hack，必將減輕咱們編碼的複雜度，少作無用功。