html - 无法显示自定义 webface 字体

Question

我有一些想要用作 webface 字体的自定义图标：

但是，我似乎无法显示它们。我看到的只是相应的字母（'a' 和 'f'）。如此处所示您还将看到字体“socialico”的工作示例

Answer 1

我有同样的问题 - 我所有的语法都是正确的。一位朋友告诉我，可能是字体本身损坏或不正确。解决方法如下：

(1) 使用从 fontfabric.com 下载的原始字体 (2) 去 www.fontsquirrel.com 生成一个新的字体工具包...包括 css (3) 上传从 FontSquirrel 生成的字体 (4) 用 css 替换我的 CSS从 FontSquirrel 为 @font-face 部分生成 (5) 更新了稍后在 CSS 中调用的字体名称

就是这样......就像一个魅力！

Answer 2

使用 @font-face 过去我在使用 font-face 时遇到了很多麻烦，但如果你输入正确，它就可以正常工作：

@font-face {
  font-family: 'Custom Font Name';
  font-style: normal;
  font-weight: 400;
  src: url(linktofont.com/font.ttf) format('truetype');
}

将“自定义字体名称”替换为您希望在使用 CSS 时命名的字体。并将“linktofont.com/font.ttf”替换为字体的路径。

EDIT 对不起，我看错了，我发现了问题。如果你看看你的@import

@import url (http://pastebin.com/raw.php?i=sc4rCApa);   

您在“url”和您的路径之间有一个空格，因此将其替换为：

@import url(http://pastebin.com/raw.php?i=sc4rCApa);