@font-face不工作

Question

嗨，我非常确定我在@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;
}

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

Answer 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'); 
}

Answer 2

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