针对IE系列浏览器设置样式可以用如下代码:
<!--[if IE]><style type="text/css">/* 在此设置专门针对IE的样式 */</style><![endif]-->
今天在实际项目中发现以上代码在IE10和IE11中无效:页面在IE6-IE9中显示正常,但在IE10-IE11中略有错位。这是为何呢?难道IE10和IE11不认以上条件注释?
查阅一翻后发现还真是如此,从IE10开始,IE不再识别条件注释:
Important As of Internet Explorer 10, conditional comments are no longer supported by standards mode. Use feature detection to provide effective fallback strategies for website features that aren't supported by the browser.
那么如何解决这个问题?可以用如下代码:
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
/* 在此设置专门针对IE10和IE11的样式 */
}
在CSS样式里添加以上代码后,页面在IE10和IE11下外观都恢复正常。另外检测发现,Windows10系统的Edge浏览器不需要对其设置特殊样式,其显示的页面是正常的。
参考:
1.条件注释
2.weboffice经验谈:IF IE ENDIF条件判断无法鉴别IE10版本导致IE10下无法加载weboffice插件的分析以及解决办法
3.About conditional comments