@font-face 不工作答案

【问题标题】：@font-face not working@font-face 不工作
【发布时间】：2011-05-09 14:07:17
【问题描述】：

嗨，我很确定我在 @font-face 配置中做错了，因为它在任何浏览器中都不起作用，这是我的 css 文件：

@font-face {
     font-family: BodyFont;
     src: url('../ItcKabMed.eot');
     src: local('ITC Kabel'),
          url('../Kabel_ITC') format('opentype'),
          url('../Kabel_ITC') format('svg');
}
body {
  font-family: 'BodyFont';
  color: #797979;
  background: url("") repeat-x scroll 0 0 #d7d7d7;
  min-width: 1000px;
}

一些想法，为什么我的字体没有显示出来？！

【问题讨论】：

标签： css font-face

【解决方案1】：

就像你看到的here，在使用@font-face时要实现跨浏览器成功，我们需要使用多种字体格式。因此，将您的字体转换为 eot、ttf 和 svg 并明确使用以下格式：

@font-face {
    font-family: 'ITC Kabel';
    src: url('ITCKabel.eot');
    src: local('ITC Kabel'), 
         local('ITCKabel'), 
         url('ITCKabel.ttf') format('truetype'),
         url('ITCKabel.svg#font') format('svg'); 
}

【讨论】：

对！.. 现在我意识到我只有 PostScript 格式的字体！我必须将其转换为其他类型。我正在尝试使用一些在线转换器，但它们都不起作用！不知道为什么！
PostScript 不像 TrueType 那样被广泛使用，因此在线工具在解释它时可能会遇到问题。也许更好地使用一些Mac程序来做到这一点。我不是 Mac 用户，所以我无法测试，但 FontForge 看起来很有希望。如果它也不起作用，则可能是您的字体有问题。尝试使用另一种字体，看看问题是否出在字体本身。

【解决方案2】：

您确定没有忘记字体路径中的文件扩展名吗？

【讨论】：

嗯.... 重点是，文件（字体）我有它s without any extension. Im 使用 mac，如果我转到文件的属性，它会说 - 种类：字体手提箱