我有一个简单的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黑客?答:都不是!