css - 如何仅为 Internet Explorer 定义 CSS 样式？

Question

我遇到过：

/* for firefox only */
@-moz-document url-prefix() {
#main_menu ul ul {
top: 37px;
}
}

仅可用于定义 Firefox 样式，是否有类似的替代方法可用于定义仅与 IE 一起使用的样式？还是这里的“条件样式表”方法被认为是最佳实践？

在这种情况下，我只想更改下拉 CSS 菜单的上边距，因此只需要为 ie 调整几个样式。

谢谢你。

ps我遇到过：

并试图提出：

<!--[if IE]><!--> <html class="ie"> <!--<![endif]-->

在头部，然后在css中定义：

.ie#main_menu ul ul {
top: 50px !important;
}

但我看不到 IE 的任何变化。

score 2 · Accepted Answer

您应该将此代码放在HTML文件中，在您的通用 CSS 之后。现在，您将拥有另一个 CSS 文件 (ie.css)，该文件将应用于 Greater Then (and Equal) IE6 和 later Then IE8 (and Equal) 浏览器。

<!--[if (gte IE 6)&(lte IE 8)]>
  <link rel="stylesheet" href="css/ie8.css" media="screen,all" />
<![endif]-->

或者你可以在你的原始 CSS 文件中使用“star property hack”。在您的 CSS 规则前面加上一个星号，您将针对 IE7 和更低版本。例子：

div{
  top:20px;
  *top:10px;
}

score 0 · Accepted Answer

您是否首先检查过您的样式规则是否在没有条件的情况下应用？您的 CSS 选择器可能有问题。我相信你的 CSS 选择器应该是“.ie #main_menu ul ul”而不是你所拥有的。注意“.ie”后面的空格

.ie #main_menu ul ul {
    top: 50px !important;
}

score 0 · Accepted Answer

您是在使用真实版本的 IE 进行测试，还是在开发人员工具中更改版本？例如，IE 中的开发人员工具几乎从不准确表示它在 IE 8 中的外观。

3 回答 3