Question

我在接受特定的@ font-face时遇到麻烦，尤其是Firefox。

这是我所做的一小部分：

＆＃13;

@font-face {
  font-family: "Cursive";
  src: url(./MTCORSVA.TTF) format("truetype");
}

.cursivefont {
  font-family: "Cursive", Verdana, Tahoma;
  font-size: 24pt;
  font-weight: bold;
}

@font-face {
  font-family: "Impact";
  src: url(./impact.ttf) format("truetype");
}

.impactfont16 {
  font-family: "Impact", Verdana, Tahoma;
  font-size: 16pt;
  font-style: italic;
  font-weight: bold;
}

@font-face {
  font-family: "overrun";
  src: url(./AMBROSIA.TTF) format("truetype");
}

.ambrofont {
  font-family: "overrun";
  font-size: 20pt;
  font-weight: bold;
}

＆＃13;

<span class=cursivefont>Join the Fight for Gunder’s Bight!</span>
<span class=impactfont16>E F</span>
<span class=ambrofont>UNCLE GLUSSOG'S TALENT PARADE</span>

＆＃13;

在Windows IE（Edge）和Android Opera以及Android本机浏览器中全部三种工作方式。在Windows Firefox和Chrome以及Android Firefox中，只有impactfont和cursivefont可以正常工作，并且默认字体用于ambrofont。虽然偶尔和不一致，Windows Firefox显示正确的字体，但在下次刷新时它没有。

我已尝试过缓存清理，重新启动并重新启动等。

Answer 1

您是否忘记了名字类的双引号？

<span class=cursivefont>Join the Fight for Gunder’s Bight!</span>
<span class=impactfont16>E F</span>
<span class=ambrofont>UNCLE GLUSSOG'S TALENT PARADE</span>

要

<span class="cursivefont">Join the Fight for Gunder’s Bight!</span>
<span class="impactfont16">E F</span>
<span class="ambrofont">UNCLE GLUSSOG'S TALENT PARADE</span>

Answer 2

您系统中的哪个Firefox版本或面临此问题？因为Firefox少于“3.5”不支持外部字体。

还有一个问题。 Firefox：默认情况下禁用，但可以启用（需要将标志设置为“true”才能使用WOFF2）。

我已经在“片段”中测试了您的代码，Firefox和Chrome工作正常。

Answer 3

我得出的结论是Ambrosia字体，或者我的AMBROSIA.TTF文件副本有问题。我为Ambrosia替换了不同的字体，每次都有效。

我不能再花这么多时间 - 我有一个Mythaxis的出版截止日期 - 但我没有关门。如果有人有一个好主意，我会感兴趣。

firefox不接受@ font-family声明

3 个答案: