旧版本 Firefox 的 !IE 中断的条件注释

Question

我需要根据正在访问页面的浏览器加载两个样式表之一：
如果不是 IE，则加载“新”样式表
如果 IE >= 9 则加载“新”样式表
如果 IE

这是用于实现此目的的代码：

<!--[if lt IE 9]>
<link type="text/css" rel="stylesheet" href="/stylesheets/old.css">
<![endif]-->
<!--[if gte IE 9]>
<link type="text/css" rel="stylesheet" href="/stylesheets/new.css">
<!--<![endif]-->
<!--[if !IE]><!-->
<link type="text/css" rel="stylesheet" href="/stylesheets/new.css">
<!--<![endif]-->

这适用于所有现代浏览器，并且旧版本的 IE 可以正确加载旧样式。但是在旧版本的 Firefox (3.6) 和可能的其他版本中，不会加载新的 css，而是将 --> 打印到网页上。这是因为必须添加声明 !IE - <!--> 的行，否则 IE 11 不会加载样式表。如果我把它拿出来，它在 Firefox 3.6 中可以正常工作。

设置这些条件 cmets 以确保其适用于各种浏览器和版本的正确方法是什么？

Answer 1

我认为问题出在<!-- 定界符之一，特别是您的IE9 条件语句中相应<![endif]--> 之前的那个定界符。 <!--[if gte IE 9]> 注释还没有被终止，因此在 HTML 中不能嵌套 cmets，因此在此处添加另一个 <!-- 分隔符实际上是无效的。虽然当前版本的 Firefox 的行为符合预期，但如果这就是 Firefox 3.6 处理方式不同的原因，我不会感到惊讶。

如果你摆脱它，Firefox 3.6 会正常运行：

<!--[if lt IE 9]>
<link type="text/css" rel="stylesheet" href="/stylesheets/old.css">
<![endif]-->
<!--[if gte IE 9]>
<link type="text/css" rel="stylesheet" href="/stylesheets/new.css">
<![endif]-->
<!--[if !IE]><!-->
<link type="text/css" rel="stylesheet" href="/stylesheets/new.css">
<!--<![endif]-->

事实上，你可以通过给你的 IE9 条件语句<!--> 处理来使你的代码更干燥，就像这样：

<!--[if lt IE 9]>
<link type="text/css" rel="stylesheet" href="/stylesheets/old.css">
<![endif]-->
<!--[if gte IE 9]><!-->
<link type="text/css" rel="stylesheet" href="/stylesheets/new.css">
<!--<![endif]-->

这完全消除了对“新”样式表的额外引用，同时仍然允许所有浏览器以及 IE9 访问它。请注意，除 9 之外的其他版本的 IE 实际上不再支持条件 cmets，因此您可以更进一步，将gte IE 9 更改为仅IE 9，它仍然可以在较新版本的 IE（以及其他浏览器）中工作。当然，为了清楚起见，欢迎您保持这种方式。

附带说明，虽然我说过在评论中包含<!-- 序列是无效的，但<!--> 被解释为<!，后跟结束分隔符-->，而不是<!--后面跟着一个>，这就是那个位很好的原因。