条件 CSS 区分 IE6 到 IE7答案

【问题标题】：CONDITION CSS differentiate between IE6 to IE7条件 CSS 区分 IE6 到 IE7
【发布时间】：2010-11-10 02:07:00
【问题描述】：

我想声明一个不同于 ie6 和 ie7 的样式，但我在 css 中的情况被 IE7 识别为 IE6。我使用 XP 和资源管理器 7。这是我使用的代码：

<!--[if !IE]>

#mainDiv{text-align:-moz-center;}

#skyBanner {top:0px;left:0px; position:fixed;visibility:hidden;}

<![endif]-->     

<!--[if lt IE 7]>

body > #skyBanner {  position: fixed;}

#skyBanner {position:absolute;visibility:hidden;

left: expression( ( 0 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );

top: expression( ( 0 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );

}

<![endif]-->

<!--[if IE 7]>

#skyBanner {position:fixed;visibility:hidden;

}    
<![endif]-->

我的错误是什么？

【问题讨论】：

条件 cmets 只有 IE 支持。因此只有 IE 可以看到<!--[if !IE]>。 IE 看到的内容被告知忽略。

标签： html css internet-explorer-6 internet-explorer-7 conditional

【解决方案1】：

您不能在 CSS 中使用条件 cmets。仅在 HTML 中。因此，您必须将不同浏览器的声明放入不同的文件中，并对它们进行条件注释几个<link>s。

更多类似的东西

<html>
  <head>
    <!--[if !IE]>
      <link rel="stylesheet" type="text/css" href="style_non_ie.css">
    <![endif]-->
    ...
  </head>
</html>

【讨论】：

【解决方案2】：

您需要采用不同的方式。使用 cmets 并附上浏览器特定 CSS 文件的链接。这样它应该可以工作：

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

<!--[if lt IE 7]>
<link href="IE6.css" rel="stylesheet" type="text/css">
<![endif]-->

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

您也可以使用<style> 标记代替链接，但这是一种不好的做法。

【讨论】：

【解决方案3】：

您的!IE 注释不正确，并且您缺少样式标签。如果这正是它在您的 HTML 中的存在方式，那么这就是您的问题。如果这是在 CSS 文件中，那么您不能在该位置使用条件 cmets。

更正：

<!--[if !IE]>-->
<style type="text/css" media="screen">
    #mainDiv {text-align:-moz-center;}
    #skyBanner {top:0px;left:0px; position:fixed;visibility:hidden;}
</style>
<!--<![endif]-->

<!--[if lt IE 7]>
<style type="text/css" media="screen">
    body > #skyBanner {  position: fixed;}
    #skyBanner {position:absolute;visibility:hidden;
    left: expression( ( 0 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px');
    top: expression( ( 0 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
    }
</style>
<![endif]-->

<!--[if IE 7]>
<style type="text/css" media="screen">
    #skyBanner {position:fixed;visibility:hidden;}
</style>
<![endif]-->

同样，正如当前编写的那样，没有浏览器看到!IE 代码。

我也不确定您是否正确编写了其他条件句。您在“if lt IE 7”条件下有“body > #skyBanner {position: fixed;}”，但据我所知，IE6 及更低版本不支持此 CSS 选择器。

因此，我所描述的任何问题都可能导致您的 IE6 和 IE7 出现问题。

【讨论】：