为什么我的Google字体无法通过@ font-face加载?

时间:2017-10-16 08:06:48

标签: html css fonts

我创建了字体并将其应用于正文:

@font-face {
     font-family: 'Nosifer';
      src: url('https://fonts.googleapis.com/css?family=Nosifer');  
  }
 body { font-family: 'Nosifer' }
<body>
  This is text.
</body>

但是,Nosifer字体不可见。我做错了什么?

小提琴:http://jsfiddle.net/9mr7973y/

2 个答案:

答案 0 :(得分:5)

Chrome在控制台中显示以下警告:

  

无法解码下载的字体:https://fonts.googleapis.com/css?family=Nosifer

     

OTS解析错误:版本标记无效

Google字体实施指南for this font不包含使用@font-face的功能。如果您想通过CSS导入它,他们建议使用@import代替:

@import url('https://fonts.googleapis.com/css?family=Nosifer');

答案 1 :(得分:0)

在html标题中添加此内容

<link href="https://fonts.googleapis.com/css?family=Nosifer" rel="stylesheet">

并应用

之类的字体
font-family: 'Nosifer', cursive;