自定义字体未应用于CSS

Question

有人可以告诉我这里有什么问题吗？我已多次检查过，无法找到问题所在。页面始终使用Impact而不是Corbert字体加载。

另外，当我通过Firebug检查发生了什么事时，＆＃39; corbert＆＃39;名称显示为灰色，当悬停它时，Firebug显示为字体演示的缩影，不是Corvert，就像它没有找到文件一样：

CSS代码（我也尝试将第一个设置为.eot）

@font-face {
font-family: ‘corbert’;
   src: url('corbert-regular.ttf');
   src: url('corbert-regular.eot?#iefix') format('embedded-opentype'),
        url('corbert-regular.woff') format('woff'),
        url('corbert-regular.ttf') format('truetype'),
        url('corbert-regular.svg#adlerRegular') format('svg');
  font-weight: normal;
  font-style: normal;
}
*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
 }

body {
    overflow-x: hidden; height:100%; width:100%; margin:0; padding:0; font-family:'corbert',Fallback, impact;
}

这里有一个包含链接字体的文件夹屏幕：

Answer 1

我的傻瓜证明@font-face代码（取自其他人难以忍受的故障排除，但我不记得是谁......）：

  

@ font-face {         font-family：'fontname';

  src: url('fonts/fontname.eot'); /* IE9 Compat Modes */
  src: url('fonts/fontname.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('fonts/fontname.woff') format('woff'), /* Modern Browsers */
         url('fonts/fontname.ttf')  format('truetype'), /* Safari, Android, iOS */
         url('fonts/fontname.svg#svgFontName') format('svg'); /* Legacy iOS */
    }

请注意，有两个src并且在几行上有#。 这个顺序似乎很重要

[编辑：来自here]

Answer 2

字体名称周围有印刷撇号，因此名称实际上是‘corbert’而不是corbert。

使用常规撇号：

font-family: 'corbert';

此外，字体的SVG名称是adlerRegular，而不是corbertRegular吗？

Answer 3

当我遇到自定义字体时遇到问题，我总是会参考这篇博文; Bulletproof @font-face Syntax

简而言之，您应该使用：

@font-face {
  font-family: 'corbert';
  src: url('corbert-regular.eot?') format('eot'), 
       url('corbert-regular.woff') format('woff'),      
       url('corbert-regular.ttf') format('truetype');
}