html - 如何修复 Firefox 3.5 中的@font-face 问题

Question

在现有代码中，我有 .EOT 嵌入字体的 CSS @font-face 声明，实际上在 Internet Explorer 中可以完美地工作。所以现在我读到 Firefox 现在也嵌入了，在 3.5 中，除了它直接嵌入 .ttf 字体。所以我修改了 firefox 的@font-face 声明并试了一下:

@font-face {
  font-family: FontX;
  src: url("FontX.eot");   //previous decl.
  src: local("FontX"), url("FontX.ttf") format("truetype");
}

它有效 - 但很难完美。

首先，斜体和粗体不会显示在页面上，尽管它们以前使用 .EOT 字体显示过。

其次，更令人不安的是以下行为:

Firefox 在显示嵌入的 ttf 字体之前闪烁默认字体半秒!

这看起来真的很蠢。

至于第二个问题，我希望可以解决的原因是 Cufon嵌入字体，存在完全相同的问题。但是，它们提供了您在收盘前调用的 Cufon.now() JS 函数 </body>标签，这为他们解决了问题。应该已经看过该函数的 JS 代码，但我几乎不是这方面的专家。

此外，IE 或 Safari 中不存在相同的默认字体闪烁。

Answer 1

如果您仅在标题和少量文本中使用非标准字体，我建议使用 sIFR .这个小的 JavaScript/Flash 库通过用一个小的轻量级 flash 对象替换选择元素来工作，它在所有浏览器中显示相同的字体......您甚至可以选择 sIFR 生成的字体，就像您选择您的任何其他文本一样网页。

看看 example page .