2

所以我有一个@font-face 设置，它适用于除 Firefox 之外的所有东西——根据谷歌的说法，这是一种常见的情况。

这是古怪的一点。如果我将字体粗细设置为粗体（在萤火虫中），它将起作用，如果我将其设置回正常，它将返回。

如果我在萤火虫中编辑字体，它会立即工作——即使我把它放回原来的样子。

例如：

@font-face {
    font-family: PlayBold;
    src: url(Play-Bold-webfont.eot);
    src: url(Play-Bold-webfont.eot?#iefix) format('embedded-opentype'),
         url(Play-Bold-webfont.woff) format('woff'),
         url(Play-Bold-webfont.ttf) format('truetype'),
         url(Play-Bold-webfont.svg#PlayBold) format('svg');

    font-weight: normal;
    font-style: normal;
    font-variant: normal;
}

#testtext {
    font-family: PlayBold;
}

结果：不使用字体。

进入萤火虫并更改字体中的任何内容（即使只是用它曾经拥有的相同字符替换一个字符），它又开始工作了。

为什么火狐一开始就不能正确加载字体？

铬 28，火狐 22。

4

1 回答 1

1

当 Gecko 显示使用 Web 字体的页面时，它最初会使用用户计算机上可用的最佳 CSS 备用字体显示文本，同时等待 Web 字体完成下载。随着每种网络字体下载完成，Gecko 会更新使用该字体的文本。这允许用户更快地阅读页面上的文本。

https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face

要尝试的事情：

  • 改组字体格式，可能将 TTF 或 WOFF 放在首位
  • 删除“字体变体：正常；” 来自“@font-face”声明，因为它不属于那里
  • 在你的 css url(file.ttf) -> url('file.ttf') 中正确引用 uri

  • ~最后的手段~使用数据 uri 生成器并将字体嵌入到 CSS

    src: url('data:application/octet-stream;base64,BLAHBLAHBLAH==') 格式('embedded-opentype'),

于 2013-08-01T12:04:17.067 回答