谷歌字体只在IE中显示一个重量

我试图在我的网站上使用不同重量的Google字体。这里是我使用的代码：谷歌字体只在IE中显示一个重量

<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">

虽然有效，但效率不高。任何人有更好的解决方案？

谢谢！

来源

2016-06-14 user2874270

如果您设置'body {font-weight：300;}'，该怎么办？默认值为'normal'，即'400'，但您没有将其包含在您的套件中。 – Stickers

谢谢你的建议，但我已经有了。 – user2874270

我无法在IE11中重现该问题。 http://jsfiddle.net/5s5o5h9n/1/在所有浏览器中看起来都一样。 –

事实证明，问题是IE设置为以兼容模式加载Intranet站点。由于开发环境位于本地网络上（因此也是Intranet站点），因此IE不知情地切换到兼容模式。打开该设置解决问题

来源

2016-06-21 14:56:19 user2874270

尝试把正确的谷歌字体提示行：

<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);

不知道还有什么可以帮忙，对不起。

来源

2016-06-14 19:56:40 pavelccz

谷歌字体只在IE中显示一个重量

回答

相关问题