CSS 检测 IE 浏览器



CSS 检测 IE 浏览器
<!--[if IE]>
<link href="ie.css" rel="stylesheet">
<![endif]-->

<!--[if IE6]>
<style type="text/css">
/* styles for IE6 goes here */
</style>
<![endif]-->

<!--[if lt IE7]>
<style type="text/css">
/* styles for IE7 goes here */
</style>
<![endif]-->

<!--[if lte IE8]>
<style type="text/css">
/* styles for IE8 goes here */
</style>
<![endif]-->

<!--[if gt IE9]>
<style type="text/css">
/* styles for IE9 goes here */
</style>
<![endif]-->

<!--[if gte IE9]>
<style type="text/css">
<!-–[if IE 7]>
<!–- 如果IE浏览器版是7,调用ie7.css样式表- –>
<link rel="stylesheet" type="text/css" href="ie7.css" />
<![endif]–->
<!–-[if lte IE 6]>
<!–- 如果IE浏览器版本小于等于6,调用ie.css样式表 -–>
<link rel="stylesheet" type="text/css" href="ie.css" />
<![endif]–>
  注意：默认的CSS样式应该位于HTML文档的首行，进行条件注释判断的所有内容必须位于该默认样式之后。
    比如如下代码，在IE浏览器下执行显示为红色，而在非IE浏览器下显示为黑色。
<!-–[if IE]>
<style type="text/css">
body{
background-color: #F00;
}
</style>
<![endif]–->


/* Target IE 10 */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
p {
color: red;
  }
}


device-pixel-ratio

<!-- Target Safari and Chrome -->

@media screen and (-webkit-min-device-pixel-ratio:0) {
p {
color: red;
  }
}

<!-- Target Firefox -->

@-moz-document url-prefix() {
p {
color: red;
  }
}

<!-- Target Opera -->

x:-o-prefocus, p {
color: red;
}


var ms_ie = false;
var ua = window.navigator.userAgent;
var old_ie = ua.indexOf('MSIE ');
var new_ie = ua.indexOf('Trident/');

if ((old_ie > -1) || (new_ie > -1)) {
    ms_ie = true;
}

if ( ms_ie ) {
   document.documentElement.className += " ie";
}


old IE

p {
color: red; /* All browsers */
color: red\9; /* IE8 and below */
  *color: red; /* IE7 and below */
_color: red; /* IE6 */
}