雖然如此，但是，很少有人知道，它到底是什麼東西，使用css hack好不好，以及它是怎樣實現的？
下面，就談一下我對css hack的認識。希望能幫助大家正確的認識css hack。
介紹之前，請先記住一句話：你今天用css hack解決相容性問題，明天瀏覽器就可能讓你那解決問題的css hack變成另乙個相容性問題。
css hack簡介
這，還要從w3c css2.1的標準說www.cppcns.com起。
w3c css2.1的標準的第四章，講了css的基本語法，資料，以及值，還講到了如何去處理不合理的值及宣告等。可以參考我分享的另外兩個帖子：【分享】說說標準 --css標準中的值，【分享】說說標準--我 的眼裡只有你--css的錯誤解析規則。
w3c css2.1 標準也規定了瀏覽器應當支援的特性屬性或值。
雖然如此，w3c也不可能強制瀏覽器廠商必須遵循標準。因此就出現了各大廠商對標準的實現不盡相同的現象。由於不同的瀏覽器，比如ie6、 ie7、 ie8、 firefox等，對css解析的標準不同，因此對於相同的 css**，可能會生成不同的頁面效果，從而無法在所有瀏覽器中得到我們想要的效果。這時，我們就需要針對不同的瀏覽器去寫不同的css**，讓它能夠在所有瀏覽器中獲得相同的效果。這個過程，就是css hack。也就是寫出只有個別瀏覽器或某些瀏覽器識別的css**。
css hack是因為現有瀏覽器對標準的解析不同，為了相容各瀏覽器，所採用的一種補救方法。
css hack是一種類似作弊的手段，以欺騙瀏覽器的方式達到相容的目的，是用瀏覽器的相容性差異來解決瀏覽器的相容性amevy問題。
因此，在設計之初，寫css hack需要遵循以下三條原則：
⃟有效： 能夠通過 web 標準的驗證
⃟只針對太古老的/不再開發的/已被拋棄的瀏覽器， 而不是目前的主流瀏覽器
⃟**要醜陋。讓人記住這是乙個不得已而為之的 hack, 時刻記住要想辦法去掉它。
現在很多hacks已經拋棄了最初的原則，而濫用hack會導致瀏覽器更新之後產生更多的相容性問題。
因此，並不推薦使用css hack來解決相容性問題。
css hack的實現方式
我總結了一下，實現css hack大概有以下幾種方式：
1. 利用瀏覽器對相同**的解析和支援的不同實現的hack
不同瀏覽器對相同的css**的支援情況可能不同。尤其是對錯誤的寫法。
例如，
css code
複製**
**如下:
#test
在ie7及以上版本的瀏覽器中會被當作錯誤特性而捨棄，但是在ie6中可以被正常的解析。這時候，可以把_width當作hack，專門針對 ie6來設定元素的寬度。
2. 以firefox或webkit特有的擴充套件樣式實現的hack
以-moz或-webkit開頭的擴充套件樣式，是瀏覽器對css標準的擴充套件。這些特性只在相應的瀏覽器裡才可以被正常的解析。 因此可以被當作css hack來使用。
以-moz開頭的firefox特有擴充套件樣式
mozilla瀏覽器支援的一些擴充套件是以-moz開頭的。這些擴充套件包括了一些功能，例如圓形邊界等。這種css只適用於mozilla瀏覽器。
比如，-moz-opacity是在firefox2.0版本出現的特性，用來實現元素的透明，但firefox3.0以後的版本中不再支援，而是直接支援標準中的opacity特性。而其他瀏覽器不支援-moz-opacity。所以，可以使用-moz-opacity來針對firefox2.0設定元素的透明度。
關於firefox擴充套件樣式的詳細資訊，見mozilla css extensions。
以-webkit開頭的webkit瀏覽器特有擴充套件樣式
與以-moz開頭的firefox特有擴充套件樣式相同，以-webkit開頭的樣式是 webkit瀏覽器特有的，只有webkit瀏覽器可以解析。
比如，在webkit瀏覽器中可以用 -webkit-border-radius實現圓角。
3. 利用ie對標準的支援缺陷寫的css hack
這個類別以中的hack以ie對標準的支援缺陷為基礎，可以讓css**針對ie6或ie7以外的瀏覽器生效。
例如，!important只有ie7及以上版本的ie及其他瀏覽器支援，所以，可以用!important來針對ie6以外的瀏覽器寫 css**；再如，head:first-child+body selector，:first-child不被ie6支援，所以可以用來針對ie6以外的瀏覽器編寫css**。
此處不在一一枚舉。
當然，有的觀點認為應用css2.1標準，不屬於css hack。見tantek's thoughts，using a css2 feature is not a hack。
4. 以ie特有的條件注釋為基礎的hack
ie瀏覽器中特有的條件注釋也經常被用作 hack，可以針對特定版本的ie寫css**。
例如，測試用例：
html code
複製**
**如下:
以上**中的 "text"，只在ie8中才會是紅色。
css hack彙總表
windows系統下各瀏覽器常用css hack彙總表，如下：
說明：
1. 此彙總表中測試瀏覽器的版本為
o ie6
o ie7
o ie8
o firefox 3.6.6
o safari 5.0
o chrome 6.0.458.1 dev
o opera 10.60
2. 其中，多數css hack是在selecto程式設計客棧r基礎上更改的。selector代表css選擇器，property代表css特性，value代表特性的值。
3. ff代表firefox，ch代表chorme，sa代表safari，op代表opera
4. q代表quirks modeamevy，s代表standards mode。
5. hack type列的數字，指的是上面css hack的實現方式中的列表號。1是指「利用瀏覽器對相同**的解析和支援的不同實現的hack」，2是指以f或webkit特有的擴充套件樣式實現的hack。
其中 *+html selector 的測試用例：
html code
複製**
**如下:
其他測試用例可在此基礎上修改。
切記，遵守css hack的三條原則。css hack是沒有辦法的時候才使用的解決相容性問題的招術，是用相容性問題去解決相容性問題，無異於飲鴆止渴。切莫一有相容性問題就使用。
另外，時刻記得改掉用css hack修補的問題。
補充一點兒好玩兒的東西，yahoo也有一種實現hack的方式，比較特殊。yahoo會利用伺服器去判斷開啟其頁面的瀏覽器的類別，然後，把資訊加到html標籤上，比如我使用firefox開啟yahoo的首頁，檢視它的html標籤，發現：
html code
…… 注意其中的ua-ff ua-win ua-ff3_6，含有瀏覽器類別和版本的資訊。
然後，在設定特定瀏覽器的樣式時，比如，我希望在firefox裡讓所有的div中的文字都是紅色，可以這樣設定：
css code
複製**
**如下:
.ua-ff div
最後再附兩條：
清除浮動
select:after
在firefox中，當子級都為浮動時，那麼父級的高度就無法完全的包住整個子級，那麼這時用這個清除浮動的hack來對父級做一次定義，那麼就可以解決這個問題。
截字省略號
select
這個是在越出長度後會自行的截掉多出部分的文字，並以省略號結尾，很好的乙個技術。只是目前firefox並不支援。
本文標題: css hack 介紹及速查對照表
本文位址:
中柏平板bios對照表 BIOS詳解及中英文對照表
編輯本段 中英對照 time system time 時間系統時間 思維 想您所想 date system date 日期系統日期 level 2 cache 二級快取 system memory 系統記憶體 video controller panel type 液晶屏型號 audio contr...
分貝dB與放大倍數的轉換關係及對照表
分貝db與放大倍數的轉換關係 增益 db 簡介 1.分貝就是放大器增益的單位 db 放大器輸出與輸入的比值為放大倍數，單位 倍 如10倍放大器，100倍放大器。當改用 分貝 做單位時，放大倍數就稱之為增益，這是乙個概念的兩種稱呼。2.電學中的分貝定義的是訊號放大倍數的對數。在對電壓 電流 與功率放大...
穩壓器及穩壓二極體型號對照表
美隆電子 貼片型穩壓二極體 線性穩壓器件 輸入輸出電流相等,壓降3v以上 型號 穩壓 v 最大輸出電流 可替代型號 79l05 5v 100ma 79l06 6v 100ma 79l08 8v 100ma lm7805 5v 1a l7805,lm340t5 lm7806 6v 1a l7806 l...