当前位置: 代码迷 >> HTML/CSS >> css界别各个浏览器和css Hack
  详细解决方案

css界别各个浏览器和css Hack

热度:445   发布时间:2012-09-09 09:27:54.0
css区分各个浏览器和css Hack
<SCRIPT LANGUAGE="JavaScript">
<!--
alert(window.navigator.userAgent);
if (window.navigator.userAgent.indexOf("MSIE")>=1)
{
 alert("ie");
}else{
   if (window.navigator.userAgent.indexOf("Firefox")>=1)
  {
   alert("firefox");
  }else if (window.navigator.userAgent.indexOf("Chrome")>=1){
   alert("chome");
  }  else{alert("others");}
}

</SCRIPT>


区别IE6与FF:
       background:orange;*background:blue;

区别IE6与IE7:
       background:green !important;background:blue;

区别IE7与FF:
       background:orange; *background:green;

区别FF,IE7,IE6:
       background:orange;*background:green !important;*background:blue;

注:IE都能识别*;标准浏览器(如FF)不能识别*;
IE6能识别*,但不能识别 !important,
IE7能识别*,也能识别!important;
FF不能识别*,但能识别!important;



引用

IE6以下
*html{}//未验证
IE 7 以下
*:first-child+html {} * html {}//未验证
只对IE 7
*:first-child+html {}//已验证
只对IE 7 和现代浏览器
html>body {}
只对现代浏览器(非IE 7)//对ff和chrome已验证、、并且都可用这个方法设置css,据说IE8也可以、、、未验证
html>/**/body {}
最新的Opera 9以下版本
html:first-child {}
Safari
html[xmlns*=”"] body:last-child {}

实例
p.test {
  background-color: red;
  *background-color: blue;//IE6
  background-color: blue!important;//IE7..比下面的级别低。共存时使用下面css
}

*:first-child+html p.test {
  background-color: black;//IE7下
}
</style>
</head>

<body>
<body>
		<p class="test">333333333333333333333</p>
</body>


IE7可以辨识「*」和「!important」,//已验证
但是IE6只可以辨识「*」,却无法辨识「!important」,//验证失败、、ie仍然可以识别
至于Firefox可以读取「!important」但不能辨识「*」//已验证
因此可以透过这样的差异来有效区隔IE6、IE7、Firefox。