兼容IE6、7、8 CSS hacker使用小結
什么是CSS hack
由于不同廠商的流覽器或某瀏覽器的不同版本（如IE6-IE11,Firefox/Safari/Opera/Chrome等） ， 對CSS的支持、解析不一樣 ， 導致在不同瀏覽器的環境中呈現出不一致的頁面展現效果 。這時 ， 我們為了獲得統一的頁面效果 ， 就需要針對不同的瀏覽器或不同版本寫特定的CSS樣式，我們把這個針對不同的瀏覽器/不同版本寫相應的CSS code的過程，叫做CSS hack!
CSS hack的原理
由于不同的瀏覽器和瀏覽器各版本對CSS的支持及解析結果不一樣，以及CSS優先級對瀏覽器展現效果的影響 ， 我們可以據此針對不同的瀏覽器情景來應用不同的CSS 。
如果想系統的學習css hacker的相關資料，推薦查看這篇文章（http://www.jb51.net/css/493362.html） 。
meta http-equiv=X-UA-Compatible content=IE=edge，chrome=1這行代碼是永遠以最新的IE版本模式來顯示網頁 ， 使IE支持HTML5 。
meta name=renderer content=webkit這行代碼是360瀏覽器渲染頁面需默認用極速內核
!--[if lt IE 9]
script src=http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js
script src=http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js
![endif]--
各瀏覽器CSS兼容問題匯總：http://www.jb51.net/css/9707.html
條件樣式替代CSS Hacks方案：http://www.paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/
建議：使用ietester軟件測試IE6、7、8 。
顧名思義，!important的優先級要高. 舉例說明：
body
{
background-color:#FF0000 !important;
*background-color:#00FF00 !important;
*background-color:#0000FF;
background-color:#000000;
}
IE6選擇最后一個，即： （因為IE6對important不感冒）
IE7選擇第二個，即：background-color:#000000;（因為IE7開始對important感冒了，同時還死守著它對 * 感情的最后一版本 ， 但important并未起到優先級的作用）
IE8和Firefox、Opera、Safari選擇第一個，即：!important;（IE8完全感冒于important，同時丟棄了對*的感情）
另外再補充一個，下劃線_,
IE6支持下劃線，IE7、IE8和Firefox、Opera、Safari均不支持下劃線 。
整理二:IE6,IE7,FireFox,Opera,Safari兼容CSS的解決方法及CSS差別
IE6,IE7,FireFox,Opera,Safari兼容CSS的解決方法及CSS差別
參考網址：http://shouce.jb51.net/csshack/
以下兩種方法幾乎能解決現今所有HACK:
1. !important
隨著IE7對!important的支持, !important 方法現在只針對IE6的HACK.(注意寫法.記得該聲明位置需要提前.)
2. IE6/IE7對FireFox
* html 與 *html 是IE特有的標簽, firefox 暫不支持.而* html 又為 IE7特有標簽.
3.當網頁在 IE 中有異常表現時，可以嘗試激發 haslayout 來看看是不是問題所在 。常用的方法是給某元素 css 設定 zoom:1 。使用 zoom:1 是因為大多數情況下，它能在不影響現有環境的條件下激發元素的 haslayout 。而一旦問題消失，那基本上就可以判斷是haslayout 的原因 。然后就可以通過設定相應的 css 屬性來對這個問題進行修正了 。建議首先要考慮的是設定元素的width/height 屬性，其次再考慮其他屬性 。
對 IE6 及更早版本來說，常用的方法被稱為霍莉破解(Holly hack) ， 即設定這個元素的高度為 1%(height:1%;) 。需要注意的是，當這個元素的 overflow 屬性被設置為 visible 時，這個方法就失效了 。或者使用 IE的條件注釋 。對 IE7 來說 ， 最好的方法是設置元素的最小高度為 0 (min-height:0;) 。
4.ie-css3.htc讓IE6, 7, 8也支持CSS3圓角，陰影，文本陰影等效果 。
附網址：http://www.jb51.net/css/63281.html
5.在mozilla firefox和IE中的BOX模型解釋不一致導致相差2px解決方法：div{margin:30px!important;margin:28px;}，注意這兩個margin的順序一定不能寫反，據阿捷的說法!important這個屬性IE不能識別，但別的瀏覽器可以識別 。所以在IE下其實解釋成這樣：div{maring:30px;margin:28px;}
重復定義的話按照最后一個來執行，所以不可以只寫margin:XXpx!important;
6.設置為float的div在ie下設置的margin會加倍 。這是一個ie6都存在的bug 。解決方案是在這個div里面加上display:inline 。
7.min-width是個非常方便的CSS命令，它可以指定元素最小也不能小于某個寬度，這樣就能保證排版一直正確 。但IE不認得這個，而它實際上把 width當做最小寬度來使 。為了讓這一命令在IE上也能用，可以把一個
放到 標簽下 ， 然后為 div指定一個類：
【兼容IE6、7、8 CSS hacker使用小結】然后CSS這樣設計：
selector{
min-width:600px;
_width:expressio n(document.body.clientWidth600?600px:auto);
}
或selector {
min-height:500px;
height:auto !important;
height:500px;
}
8.ie下元素消失，給該元素添加：position:relative;
9.IE7瀏覽器下 ， 文字越多，按鈕兩側padding留白就越大，解決辦法是添加overflow：visible屬性 。
