Amatic SC normal 700 - 问号字符出现渲染问题?

Amatic SC normal 700 - rendering issue with question mark character?

我正在使用来自 google 字体的 Amatic SC 700 normal
这是 google 字体上的 link :https://www.google.com/fonts/specimen/Amatic+SC .

问题是现在 char ?® 中转换。

我使用的css代码是:

@import url(http://fonts.googleapis.com/css?family=Amatic+SC:400,700);

body {
    font-family: 'Amatic SC', cursive;
    font-style: normal;
    font-weight: 700;
}

html 看起来像这样:

 <html> ???? </html>

这是问题的截图:

这是 jsfiddle link:http://jsfiddle.net/m4vev43a/

我测试了这个问题:

知道如何解决这个问题吗?
我的浏览器变得疯狂了吗?
或者它是字体中的错误?

更新:

使用时:

 @import url(http://fonts.googleapis.com/css?family=Amatic+SC);

所以没有后缀 :400,700 问号字符显示正确。

不幸的是,使用上面的代码 + 粗体文本完全弄乱了 Chrome、Firefox、Opera 中的字母间距。

这是 Amatic 字体粗体版本的一个已知问题,从 2011 年 11 月的 bug report 中可以看出。您的字体已正确实现,只是字体文件本身有一个错误。

解决方法是对问号使用常规变体。我知道这不是一个很好的解决方案,但似乎您无能为力。

我曾经使用过一种可能的解决方法来恢复这种情况。

注意:如果您需要信任每个浏览器的字母间距, 并不完美。

其实这个想法是:

  • 再次定义 Amatic 字体和标准字体,但没有 :700
  • 生成一个特殊的 class 来处理带有问号
  • 的句子
@font-face {
    font-family: 'Amatic';
    src: url(http://fonts.gstatic.com/s/amaticsc/v6/DPPfSFKxRTXvae2bKDzp5FtXRa8TVwTICgirnJhmVJw.woff2) format('woff2'), url(http://fonts.gstatic.com/s/amaticsc/v6/DPPfSFKxRTXvae2bKDzp5D8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}

.has-question-mark {
    font-family: Amatic;
}