Chrome和Firefox不会渲染我的@ font-face，safari会

Question

我在使font-face正常工作时遇到问题。我是这样定义的：

@font-face {
  font-family: "creampuff";
  src: local("☺"), url(/fonts/CREAMPUF.TTF) format('truetype');
}

如果在机器上安装了这种字体，这完全没问题（我这里有3台机器，一台安装了字体并且有效，另外两台没有，并且它呈现不同的字体。）它只能在不正确的情况下呈现Firefox和Chrome，Safari能够很好地呈现它：

Chome和Firefox都像这样呈现：

但是，如果我在Chrome的网络检查器中禁用该样式（定义为：'font-family：creampuff;'），它肯定会产生效果，将字体更改为：

我甚至无法弄清楚从哪里开始调试。我已经检查了Chrome中的网络标签，它肯定会成功加载字体。打开字体文件显示一切正确，在我本地安装字体的其他机器上，它可以在所有浏览器中正常运行。

知道如何解决这个问题吗？

Answer 1

也许尝试将font-style: normal添加到css：

@font-face {
  font-family: "creampuff";
  src: local("☺"), url(/fonts/CREAMPUF.TTF) format('truetype');
  font-style: normal;
}

如果这不起作用，您可以尝试将字体转换为其他格式。 FontSquirrel有一个方便的工具：http://www.fontsquirrel.com/fontface/generator。如果你愿意，它甚至会为你生成css。

Answer 2

对我来说也没有用，但最终做的工作是将字体系列的名称从长名称更改为短名称：从“Swiss 721 Black Extended BT”改为“Swis721 BlkEx BT”。