HACK就是針對不同的瀏覽器寫不同的HTML、CSSyangshi_10628_1.html' target='_blank'>CSS樣式，從而使各種瀏覽器達到一致的渲染效果。

下面我們就分別了解一下HTML的hack和CSS的hack。

（一）、HTML的hack

HTML的hack由注釋 !-- -- 演變而來，在高級瀏覽器中注釋不會被加載，把IE瀏覽器的兼容代碼寫在注釋中，IE瀏覽器會識別。

HTML的hack代碼模板：

注：

①用于寫兼容的注釋，標簽內首位都要加！感嘆號。

②單詞都寫在一對中括號中

③IE和版本號之間要加空格

④不加比較單詞，表示只兼容這一個版本；

比較單詞：lt=less than(小于)、lte=less than or equal (小于等于)、gt=great than(大于)、gte=great than or equal(大于等于)

 !--[if IE ６] ｐ 只有IE6認識我 ／p ![endif]-- 

只要記住這一個模板就知道HTML的兼容怎么寫了，下面我們列舉幾個：

 !--[if gte IE 9]  h1 大于等于IE9的瀏覽器能看到 /h1  ![endif]-- 

 !--[if lte IE 8]  h1 >
單獨寫給IE6的解決兼容問題的HTML代碼： !--[if IE 6]  script src= js/iepng.js?1.1.11 type= text/javascript /script  script type= text/javascript  EvPNG.fix( div,ul,img,li,input,span,b,h1,h2,h3,h4  /script  ![endif]-- 
 
（二）、CSS的hack
CSS的hack包括：屬性的hack和選擇器的hack
設置css的hack要注意的是css樣式的層疊性，給同一個元素設置的兼容寫法必須寫在后面，否則會被層疊掉。
（1）屬性的hack
①只兼容IE6的hack
hack符：-或_，當做前綴寫在屬性前面，中間不加空格
在屬性名前面加短橫-或者下劃線_(原理：高級瀏覽器及其他瀏覽器會認為這個前綴符號是一個unknown property name)，未知的屬性名，不會報錯，不予加載。
例：
background:red; //高級瀏覽器識別_background:pink; //僅IE6識別
 
②兼容IE6、7的hack
 hack符： ` ~ ! @ # $ % ^ * ( ) + = [ ] | , . 中的任一字符，作為前綴寫在屬性前面
例：
background:red; //高級瀏覽器識別！background:pink; //僅IE6、7識別
 
③只兼容IE8的hack
hack符：/0/，必須寫在屬性值與分號之間，中間不加空格
background:red; //高級瀏覽器識別background:pink/0/; //僅IE8識別
 
④兼容IE8、9、10的hack
hack符：/0，必須寫在屬性值與分號之間，中間不加空格
background:red; //高級瀏覽器識別background:pink/0; //IE8、9、10識別
 
⑤兼容IE6、7、8、9、10
hack符：/9，必須寫在屬性值與分號之間，中間不加空格
 
（2）選擇器的hack
給選擇器添加hack，這個選擇器中的樣式都是IE兼容樣式，其他高級瀏覽器不識別，同理給同一個選擇器設置的兼容樣式要寫在高級瀏覽器可識別的常規樣式后面，否則會被層疊
①IE6及以下版本的hack
hack符：* html，*和html之間有空格，再加一個空格，后面寫選擇器
例：
 !--常規寫法-- 
 .box{ width: 200px; height: 200px; border-radius: 50%; background: yellowgreen; }
 ！--兼容寫法-- * html .box{ width: 100px; height: 100px; background: skyblue; }
 
②IE7及以下版本的hack
hack符：，英文逗號，寫在選擇器后面，不加空格
例：
.box,{ background: #999; border: 10px solid red;
 
③兼容IE6以外的其他版本的hack
hack符：html body，寫在選擇器前面，與選擇器之間有一個空格隔開
例：
html body .box{ background: yellow;}
 
④兼容IE6、7以外的版本的hack
hack符：html /**/或html~/**/,寫在選擇器前面，與選擇器之間有一個空格隔開
例：
html /**/body .box{ background: purple;}
 
用一行代碼來解決CSS在,IE6,IE7,IE8,IE9,IE10 中的各種兼容性問題。
在網站前端寫代碼的過程中，很多時間IE各個版本的兼容問題很難整?，F在百度與谷歌都有了一行解決這種兼容性的代碼了。如下面的。
辦法一
百度也應用了這種方案去解決IE的兼容問題
百度源代碼如下
1 !Doctype html 
2 htmlxmlns=http://www.w3.org/1999/xhtmlxmlns:bd=http://www.baidu.com/2010/xbdml 
3 head 
4 metahttp-equiv=Content-Typecontent=“text/html;charset=utf-8″ 
5 metahttp-equiv=X-UA-Compatiblecontent=IE=EmulateIE7 
6 title 百度一下，你就知道 /title 
7 script varwpo={start:newDate*1,pid:109,page:‘superpage’} /script 
 meta http-equiv=X-UA-Compatible content=IE=EmulateIE7 
可以打開百度，右鍵查看源碼看下！我們可以看下文件頭是否存在這樣一行代碼！
這句話的意思是強制使用IE7模式來解析網頁代碼！
在這里送上幾種IE使用模式！
8 metahttp-equiv=“X-UA-Compatible”content=“IE=8″ 
2. Google Chrome Frame也可以讓IE用上Chrome的引擎:
9 metahttp-equiv=“X-UA-Compatible”content=“chrome=1″/ 
3.強制IE8使用IE7模式來解析
10 metahttp-equiv=“X-UA-Compatible”content=“IE=EmulateIE7″ !– IE7 mode – 
11 //或者
12 metahttp-equiv=“X-UA-Compatible”content=“IE=7″ !– IE7 mode – 
4.強制IE8使用IE6或IE5模式來解析
13 metahttp-equiv=“X-UA-Compatible”content=“IE=6″ !– IE6 mode – 
14 metahttp-equiv=“X-UA-Compatible”content=“IE=5″ !– IE5 mode – 
5.如果一個特定版本的IE支持所要求的兼容性模式多于一種，如：
15 metahttp-equiv=“X-UA-Compatible”content=“IE=5; IE=8″/ 
以上就是IE瀏覽器兼容問題的幾點寫法分享的詳細內容，html教程        
鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。