仅为 IE 设置 CSS



我有一个简单的div,边框厚2px,绝对位置隐藏,直到其父元素悬停。由于IEs盒子模型,所述div的位置在IE中有些偏差,但在任何其他浏览器中都没有。我不想为 IE 添加完全独立的样式表,如果浏览者使用的是 IE,我只想修改类本身。

那么如何仅为IE修改添加特定类呢?

你需要使用一种叫做条件注释的东西。这些仅在IE中有效(其他浏览器会将它们视为注释),因此它们是仅针对IE的好方法。

示例 - 如果您希望在IE6中完成某些操作,请使用以下内容:

<!--[if IE 6]>
Special instructions for IE 6 here
<![endif]--

若要了解详细信息,请访问有关条件注释的官方 MSDN 源。

您可以在 html(或其他任何)文件中添加以下条件片段。之后,您可以在ie_stylesheet.css中定义新的类属性

  <!--[if IE]>
    <link type="text/css" rel="stylesheet" media="all" href="ie_stylesheet.css"/>
  <![endif]-->

我认为这里有足够的解释。

您可以通过在

样式表的开头添加 CSS 重置来尝试避免使用 IE 样式表。请看以下内容: http://www.cssreset.com/scripts/html5-doctor-css-reset-stylesheet/

重置应该有助于使元素在所有浏览器中的行为相同。

我发现这种条件注释的用法是一种非常优雅的方式,可以用你可以在CSS和JS中使用的类来标记你的<html>标签:

<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html lang="en"> <!--<![endif]-->

作为人为的例子,如果要以 IE6 为目标将所有链接设为红色,则可以使用如下特异性:

.lt-ie7 a {
  color: red;
}

无需单独的样式表。

来源:条件样式表与CSS黑客?答:都不是!

最新更新