为什么 css class 没有被 IE9 覆盖?
Why css class is not overridden for IE9?
我有一段 HTML 代码,其中我们正在为 IE9、IE10 和 IE11 应用特殊 css。
<!doctype html>
<!--[if IE 9]><html data-placeholder-focus="false" lang="{%=user_locale_html}}" dir="ltr" class="ie9 lt-ie10 lt-ie11 lt-ie12 gt-ie8 gt-ie7 gt-ie6"><![endif]-->
<!--[if !(IE)]><!--><html lang="{%=user_locale_html}}" dir="{%=dir}}">
<script>
var ua = window.navigator.userAgent;
if (ua.indexOf("Trident/7.0") > 0)
document.documentElement.className='ie11 lt-ie12 gt-ie10 gt-ie9 gt-ie8 gt-ie7 gt-ie6';
else if (ua.indexOf("Trident/6.0") > 0)
document.documentElement.className='ie10 lt-ie11 lt-ie12 gt-ie9 gt-ie8 gt-ie7 gt-ie6';
if(/*@cc_on!@*/false){
document.documentElement.className='gt-ie11 gt-ie10 gt-ie9 gt-ie8 gt-ie7 gt-ie6';
}
</script>
<!--<![endif]-->
</html>
注意代码if(/*@cc_on!@*/false) {}
当我们有 userAgant=Trident/6.0.
时,此代码将覆盖 IE10 中应用的 css class(这导致我无法覆盖 ie10
class。
但我的问题是,当浏览器是 IE9 时,为什么这段代码没有覆盖 classes?
我知道代码中不需要@cc_on 相关内容,但我很想知道它的行为有何不同。
谢谢!
可能您的代码没有识别 IE 9,这就是为什么 CSS class 没有被覆盖。
我建议你尝试参考下面的代码示例,它可以找到 IE 8、IE 9、IE 10、IE 11。
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<script>
function GetIEVersion() {
var sAgent = window.navigator.userAgent;
var Idx = sAgent.indexOf("MSIE");
// If IE, return version number.
if (Idx > 0)
return parseInt(sAgent.substring(Idx+ 5, sAgent.indexOf(".", Idx)));
// If IE 11 then look for Updated user agent string.
else if (!!navigator.userAgent.match(/Trident\/7\./))
return 11;
else
return 0; //It is not IE
}
if (GetIEVersion() > 0)
alert("This is IE " + GetIEVersion());
else
alert("This is not IE.");
</script>
</head>
<body>
</body>
</html>
输出:
此外,您可以尝试根据自己的需求进行修改,可能会帮助您解决问题。
我有一段 HTML 代码,其中我们正在为 IE9、IE10 和 IE11 应用特殊 css。
<!doctype html>
<!--[if IE 9]><html data-placeholder-focus="false" lang="{%=user_locale_html}}" dir="ltr" class="ie9 lt-ie10 lt-ie11 lt-ie12 gt-ie8 gt-ie7 gt-ie6"><![endif]-->
<!--[if !(IE)]><!--><html lang="{%=user_locale_html}}" dir="{%=dir}}">
<script>
var ua = window.navigator.userAgent;
if (ua.indexOf("Trident/7.0") > 0)
document.documentElement.className='ie11 lt-ie12 gt-ie10 gt-ie9 gt-ie8 gt-ie7 gt-ie6';
else if (ua.indexOf("Trident/6.0") > 0)
document.documentElement.className='ie10 lt-ie11 lt-ie12 gt-ie9 gt-ie8 gt-ie7 gt-ie6';
if(/*@cc_on!@*/false){
document.documentElement.className='gt-ie11 gt-ie10 gt-ie9 gt-ie8 gt-ie7 gt-ie6';
}
</script>
<!--<![endif]-->
</html>
注意代码if(/*@cc_on!@*/false) {}
当我们有 userAgant=Trident/6.0.
时,此代码将覆盖 IE10 中应用的 css class(这导致我无法覆盖 ie10
class。
但我的问题是,当浏览器是 IE9 时,为什么这段代码没有覆盖 classes?
我知道代码中不需要@cc_on 相关内容,但我很想知道它的行为有何不同。
谢谢!
可能您的代码没有识别 IE 9,这就是为什么 CSS class 没有被覆盖。
我建议你尝试参考下面的代码示例,它可以找到 IE 8、IE 9、IE 10、IE 11。
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<script>
function GetIEVersion() {
var sAgent = window.navigator.userAgent;
var Idx = sAgent.indexOf("MSIE");
// If IE, return version number.
if (Idx > 0)
return parseInt(sAgent.substring(Idx+ 5, sAgent.indexOf(".", Idx)));
// If IE 11 then look for Updated user agent string.
else if (!!navigator.userAgent.match(/Trident\/7\./))
return 11;
else
return 0; //It is not IE
}
if (GetIEVersion() > 0)
alert("This is IE " + GetIEVersion());
else
alert("This is not IE.");
</script>
</head>
<body>
</body>
</html>
输出:
此外,您可以尝试根据自己的需求进行修改,可能会帮助您解决问题。