CSS3 字体嵌入

Question

我试图简单地嵌入我已上传到服务器的字体。

所有内容均已正确加载，但显示的字体错误。我知道这种情况正在发生，因为当我删除 @font-face 代码时，渲染的 HTML 字体会发生变化。

这是我的代码，在过去的一个小时里我玩过很多不同的东西，所以大声说出你认为可能有用的东西。我也尝试过 .TTF 文件。

@font-face {
    font-family: Joan;
    src: url("../fonts/joan.otf") format('font/opentype');
}
body {
    background: url('../images/bg.gif');
    font-family: Joan;
}

Answer 1

http://www.fontsquirrel.com/fontface/generator

到目前为止，我在相关领域中获胜冒险。

这是一个网站我正在使用它进行开发：http://bigballoon.businesscatalyst.com/

Answer 2

您可能必须将字体名称放在引号中。此外，为了兼容 MSIE，您需要将字体转换为 .eot 格式。这是“bulletproof”@font-face per paulirish.com。您可能需要根据完整/后记字体名称进行调整：

@font-face {
   font-family: 'Joan';
   src: url('../fonts/joan.eot');
   src: local('Joan Regular'), local('Joan'), 
        url('../fonts/joan.otf') format('opentype'); 
}