Question

这是我的HTML代码。问题是IE 10不能使用带有h2标签的Exo 2字体。它使用Tahoma。 Firefox和其他人能够正确显示所有字体。

<head>
  <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Exo+2:500,600" />

  <!--[if IE]>
    <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Exo+2:500" />
    <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Exo+2:600" />
  <![endif]-->
</head>

<body>
  <p>Here the font is Exo 2. So, everything is just fine!</p>

  <h2>Here the font should not be Tahoma, but it is when using IE 10</h2>
</body>

这是我目前的CSS代码。 h2标签应该是Exo 2和font-weight 600，但是IE 10 Tahoma而不是Exo 2.

body {
  font-family: "Exo 2", Tahoma, sans-serif;
  font-weight: 500;
  font-size: 11px;
  color: #000000;
}

h2 {
  font-family: "Exo 2", Tahoma, sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 12px;
  color: #B4166F;
}

我怎么能解决这个问题？顺便说一句，我不喜欢使用JavaScript和/或jQuery。

修改

我刚注意到这可能与font-weight 600有关。如果值始终为500，IE会正确显示Exo 2字体。但是当我用600替换500时，IE将显示Tahoma而不是Exo 2.

body {
  font-family: "Exo 2", Tahoma, sans-serif;
  font-weight: 500;
  font-size: 11px;
  color: #000000;
}

h2 {
  font-family: "Exo 2", Tahoma, sans-serif;
  font-style: normal;
  font-weight: 500; /* if this is 500, no problems at all! */
  font-size: 12px; /* this works fine, too */
  color: #B4166F;
}

<head>
  <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Exo+2:500,600" />

  <!--[if IE]>
    <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Exo+2:500" />
    <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Exo+2:600" />
  <![endif]-->
</head>

<body>
  <p>Here the font is Exo 2. So, everything is just fine!</p>

  <h2>Here the font is Exo 2 when using IE 10 if the font-weight of h2 is 500 instead of 600. So, works just fine. But when the font-weight is 600, here the font will be Tahoma istead of Exo 2 when using IE 10. Should be Exo 2.</h2>
</body>

编辑2：

我刚注意到，如果我在地址栏上输入URL并按回车键，则字体Exo 2将在IE中正确显示。当我刷新页面时，将再次看到Tahoma。我不明白为什么会这样。

那么，我接下来应该尝试什么？

Answer 1

我只想在顶部的样式表中导入它

@import url（https://fonts.googleapis.com/css?family=Exo+2）;

Answer 2

有条件的评论在IE9之后不再适用于IE。我会在其他地方看看为什么Exo2不能仅在h2中起作用，因为这不应该发生。

Answer 3

解决。工具 - ＆gt;互联网选项 - ＆gt;重置Internet Explorer设置。这对我有帮助。现在IE 10可以很好地使用Google字体。

IE 10显示Tahoma而不是Google字体

3 个答案: