仅适用于 Internet Explorer 10 的条件 CSS

沃梦达教程前端问题

2022-01-01

Conditional CSS for Internet Explorer 10 only(仅适用于 Internet Explorer 10 的条件 CSS)

本文介绍了仅适用于 Internet Explorer 10 的条件 CSS的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

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

Internet Explorer 10 has broken my jQuery menu. I can fix this by applying a small revision to our CSS as per the example below.

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

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

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

Is there a way to apply these cases conditionally in my CSS include?

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

I know browser sniffing is not ideal, but this seems to work fine:

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

推荐答案

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

Seeing as you're already relying on JavaScript for your menu, you could add a class to the <body> using JavaScript code based on the userAgent string:

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

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

..and then target Internet Explorer 10 in your CSS

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

这篇关于仅适用于 Internet Explorer 10 的条件 CSS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！

沃梦达教程

本文标题为：仅适用于 Internet Explorer 10 的条件 CSS

上一篇：如何检查表单输入是否有价值

下一篇：多个 if 语句的替代方案

基础教程推荐

学习HTML

学习jQuery

学习Laravel

学习CSS3

学习Vue.js

学习Bootstrap5

学习ThinkPHP

学习AJAX