css兼容性hack (ie6,ie7,ie8,firefox,chrome)

IE各版本浏览器之间的识别概括如下：

IE6：能识别 * 、\9 和 _ ，不能识别 !important

IE7：能识别 * 、\9 和 !important，不能识别 _

IE8：能识别 \9 和 !important ，不能识别 _ 和 *

Firefox(Chrome)：能识别 !important，不能识别 _ 和 *

书写顺序，一般是将识别能力强的浏览器的css写在后面。

 

1. !important

!important 的作用是提高指定样式规则的应用优先权，只有IE6不识别

区别IE6和（IE7以上及其他浏览器）

body{
    color:blue !important;-------------------------①
    color:red;-------------------------------------②
}

  只有IE6显示红色的字体，其他浏览器都显示蓝色的字体，!important 表示优先级，所以要放在前面，顺序为①②，不能反过来。

 

2. *

 * 的作用是区别IE6/7浏览器和IE8以上及其他标准浏览器的，如Firefox、Chrome

body{
    color:blue;
    *color:red;
}

只有IE6/7是显示红色字体，IE8及其他标准浏览器（Firefox、Chrome）不识别 *，显示的是蓝色字体。

 

3. _

 _ 的作用是区别IE6和（IE7以上及其他浏览器）

body{
    color:blue;
    _color:red;
}

  只有IE6显示红色的字体，其他浏览器都显示蓝色的字体

 

4.  \9

 \9 的作用是可以结合 * 和 _ 区分出IE8来

body{
  background-color: #CC00FF; /*所有浏览器都会显示为紫色*/
  background-color: #FF0000\9; /*IE6、IE7、IE8会显示红色*/
  *background-color: #0066FF; /*IE6、IE7会变为蓝色*/   
  _background-color: #009933; /*IE6会变为绿色*/
}

这样就把IE6、IE7、IE8和其他标准浏览器区别开来了
好多css hack，最重要的是简单实用能解决问题就行了
总结：
\9 ： IE6 IE7 IE8
*  ： IE6 IE7
_  ： IE6

  注意：IETester中可能会发现IE7和IE8没有区分开来，请换原生的IE8浏览器来测试，不要太相信IETester;