HTML：使用条件注释

Question

美好的一天，

我想在IE8中应用两个不同的CSS代码来修复一些字体渲染问题（虚假粗体），如果它们具有相同的名称，后者无法识别所有字体系列，而只能识别第一个字体 - 家庭，所以我试图使用条件评论来解决这个问题：

第一个代码适用于旧版本的IE（包括IE8）：

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

第二个适用于IE9，IE10和所有非IE浏览器（Chrome，Firefox，Opera，Safari ......），它们都没有这个虚假的大胆问题：

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

我知道第一个代码是正确的（或者可能不是：p），所以我想知道第二个代码是否也是正确的，因为当我在IE中更改兼容模式时，我没有得到我所期望的，当然有条件错误[如果IE 9 | ！IE] 我还想知道正确的顺序（如果有的话）来放置这两个条件注释。 请帮助我，因为我是兼容兼容性的新手：/

Answer 1

您可以首先应用IE9 +和其他浏览器的css，然后应用IE8或更低版本的条件注释，因此font-family中的fonts.css规则将被{IE8fonts.css中的规则覆盖1}}，如果浏览器小于或等于IE8。这样您就可以避免复杂且不必要的条件注释。

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

希望它有所帮助。

Answer 2

条件注释是IE特定的功能。其他浏览器只是将它们视为普通注释。请注意，HTML评论以<!--开头，以-->结尾。因此<!--[anything]>是正常评论的开始，非IE用户代理将在此之后忽略任何内容，直到-->的下一次出现。另一方面，<!--[anything]><!-->是一个完整的评论，非IE浏览器将处理之后的任何内容。

所以我建议你使用：

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

从常规HTML解析器（非IE）的角度来看，这是包含链接元素的两个常规注释。