谷歌字体在 IE 中只显示一种粗细答案

【问题标题】：Google fonts only showing one weight in IE谷歌字体在 IE 中只显示一种粗细
【发布时间】：2016-06-21 22:56:19
【问题描述】：

我正在尝试在我的网站上使用不同粗细的 Google 字体。这是我正在使用的代码：

<link href="//fonts.googleapis.com/css?family=Roboto:100,300,500" rel="stylesheet">

在 Chrome 和 Safari 中一切正常。但在 IE 中，无论我为元素设置什么字体粗细，一切看起来都是粗体。

我找到了一种解决方法。如果我单独加载每个字体粗细（使用下面的代码），一切都可以在 IE 中运行。

<link href="//fonts.googleapis.com/css?family=Roboto:100" rel="stylesheet">
<link href="//fonts.googleapis.com/css?family=Roboto:300" rel="stylesheet">
<link href="//fonts.googleapis.com/css?family=Roboto:500" rel="stylesheet">

这行得通，但效率低下。谁有更好的解决方案？

谢谢！

【问题讨论】：

如果设置body{font-weight:300;}会怎样？默认值为normal，即400，但您没有将其包含在您的工具包中。
感谢您的建议，但我已经准备好了。
我无法在 IE11 中复制该问题。 jsfiddle.net/5s5o5h9n/1 在所有浏览器中看起来都一样。
也许问题是，什么版本的IE？什么版本的 Windows？

标签： html css internet-explorer fonts

【解决方案1】：

尝试放置正确的谷歌字体建议行：

<link href='https://fonts.googleapis.com/css?family=Roboto:100,300,500' rel='stylesheet' type='text/css'>

或者把字体放到你的css文件中：

@import url(https://fonts.googleapis.com/css?family=Roboto:100,300,500);

不知道还有什么可以帮助的，抱歉。

【讨论】：

【解决方案2】：

原来问题在于 IE 被设置为以兼容模式加载 Intranet 站点。由于开发环境位于本地网络（因此是 Intranet 站点）上，IE 在我不知情的情况下切换到兼容模式。关闭该设置可解决问题

【讨论】：