整理关于区别各大浏览器的css hack

区别符号:  [ \9 ],[ * ],[ _ ],[ !important ] ……       以及css选择符前缀法:[*html”],[*+html]……
符号说明: 
[ \9 ]:仅IE系列能识别;
[ * ]:仅IE6、IE7能识别;
[ _ ]:仅IE6识别;
[*html”]:仅IE6识别;
[*+html]:仅IE7识别;
[:root .class{****\9}]:仅IE9能识别 ;
@media all and (min-width:0){ .class{ ****\9 } }:仅IE9能识别,不过权重(优先级)比一行的小
 [ !important ]:仅IE6不能识别,即IE7、IE8、IE9、Firefox、Chrome、Safari、Opera能识别。
例子:
 .test{
 background:blue;
 background:red\9;
 *background:black;
 _background:orange;
 }
 :root .ie9{
background:yellow\9;
}

分析:
第一条:是正常情况下的;第二条:是专属IE系列的;第三条:是专属IE6、IE7的;第四条:是专属IE6的。
至此,我们可以从其他浏览器中区分出IE来,而IE里面,我们还区分了IE6、IE7,可是IE8、9呢?就是下面那段,只要我们把 [.ie9] 这个类名也加到元素中去的话,就可以区别IE8和IE9了。记着,不要跟上面那个混淆了。
所以,根据浏览器从上往下读的顺序,而且从下往上分析,可以得出注释()里的结果;而[ !important ]的用法则是这样的:background:green !important;

 

前面几个是加在css属性的前后,但是[*html”],[*+html]则是加在选择符前面。
记着,要用类名,不要用id,无论是上面的方法还是下面的方法,因为类名可以叠加多个类名,而id只能有一个,而且权重(优先级)比类名重。

例子:
*html .test{/*仅仅IE6能识别*/
background:blue;
}
*+html .test{/*仅仅IE7能识别*/
background:blue;
}

 

根据自己的需要,自己灵活运用以上的hack进行组合,得出 自己想要的结果

判断IE版本的语句<!–[if IE]><![endif]–>http://hedgehogking.com/?p=128

  6 Responses to “区别IE6、IE7、IE8、IE9、Firefox、Chrome、Safari、Opera等浏览器的兼容性问题”

  1. [...] 区别符号:  [ 9 ],[ * ],[ _ ],[ !important ] 区别IE6、IE7、IE8、IE9、Firefox、Chrome、Safari、Opera等浏览器的兼容性问题 http://hedgehogking.com/?p=121 [...]

  2. Ha6vSh goltgyfnevva, [url=http://dagjximhkhkp.com/]dagjximhkhkp[/url], [link=http://njkojuaqpchg.com/]njkojuaqpchg[/link], http://qekpqoblvvfa.com/

  3. WONDERFUL Post.thanks for share..extra wait .. …

  4. [...] ladies electric shaver reviews best electric razor for bald heads top electric shaver reviews best electric razor electric shaver review compare best electric razor for head [...]

 Leave a Reply

(required)

(required)

* Copy This Password *

* Type Or Paste Password Here *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

   
© 2012 Hedgehog Suffusion theme by Sayontan Sinha