仅适用于 Internet Explorer 10 的条件 CSS [重复]答案

【问题标题】：Conditional CSS for Internet Explorer 10 only [duplicate]仅适用于 Internet Explorer 10 的条件 CSS [重复]
【发布时间】：2013-03-11 03:52:27
【问题描述】：

Internet Explorer 10 损坏了我的 jQuery 菜单。我可以通过按照下面的示例对我们的 CSS 进行小修改来解决此问题。

/* For Internet Explorer 10 ------*/
margin-top: 1px;

/* For all other browsers ------*/
margin-top: 2px;

有没有办法在我的 CSS 包含中有条件地应用这些情况？

我知道浏览器嗅探并不理想，但这似乎工作正常：

if ($.browser.msie  && parseInt($.browser.version, 10) === 10) {
    $(".jMenu li ul").css("margin", "1px");
}

【问题讨论】：

重复。 stackoverflow.com/a/13954700/1538708
IE10 不支持条件语句，但这可能会有所帮助：impressivewebs.com/ie10-css-hacks
$.browser 已被弃用并从最新的 jquery 版本中删除 api.jquery.com/jQuery.browser
感谢 xec，我相信我们使用的是 1.8，但我会调查一下。你知道另一种方法吗？
@QF_Developer 是的，您可以查看navigator.userAgent，就像我在我的回答中发布的那样:) - 用户代理嗅探通常是一件坏事，但是您概述问题的方式似乎是最直接的方法。更简洁的解决方案是找出边距破坏菜单的原因，但我们需要更多信息。

【解决方案1】：

鉴于您的菜单已经依赖 JavaScript，您可以使用基于 userAgent 字符串的 JavaScript 代码向 <body> 添加一个类：

if (navigator.userAgent.indexOf("MSIE 10") > -1) {
    document.body.classList.add("ie10");
}

..然后在您的 CSS 中定位 Internet Explorer 10

/*IE 10 only */
.ie10 .myClass {
    margin-top: 1px;
}

【讨论】：