字体未显示但没有错误

Question

我在过去几天里一直在使自己成为一个新网站，并且在使用我的localhost时没有遇到字体问题，但现在上传到GitHub时它们现在无法正常工作。所有文件都在那里，我已经检查了文件的命名。我在chrome的开发人员选项中使用了Network选项卡来查看字体是否已加载

您可以在此处查看网站 - http://jamiecurd.github.io/ 其余代码在这里 - https://github.com/jamiecurd/jamiecurd.github.io/tree/master/assets/font/montserrat

这是加载字体

＆＃13;

＆＃13;

/*Fonts*/
@font-face {
  font-family: 'black';
  src: url('/assets/font/montserrat/Montserrat-Black.ttf') fromat('truetype'),
  src: url('../font/montserrat/Montserrat-Black.woff') format('woff');
}
@font-face {
  font-family: 'bold';
  src: url('/assets/font/montserrat/Montserrat-Bold.ttf') format('truetype'),
  src: url('../font/montserrat/Montserrat-Bold.woff') format('woff');
}
@font-face {
  font-family: 'extrabold';
  src: url('/assets/font/montserrat/Montserrat-ExtraBold.ttf') format('truetype'),
  src: url('../font/montserrat/Montserrat-ExtraBold.woff') format('woff');
}
@font-face {
  font-family: 'hairline';
  src: url('/assets/font/montserrat/Montserrat-Hairline.ttf') format('truetype'),
  src: url('../font/montserrat/Montserrat-Hairline.woff') format('woff');
}
@font-face {
  font-family: 'light';
  src: url('/assets/font/montserrat/Montserrat-Light.ttf') format('truetype'),
  src: url('../font/montserrat/Montserrat-Light.woff') format('woff');
}
@font-face {
  font-family: 'regular';
  src: url('/assets/font/montserrat/Montserrat-Regular.ttf') format('truetype'),
  src: url('../font/montserrat/Montserrat-Regular.woff') format('woff');
}
@font-face {
  font-family: 'semibold';
  src: url('/assets/font/montserrat/Montserrat-SemiBold.ttf') format('truetype'),
  src: url('../font/montserrat/Montserrat-SemiBold.woff') format('woff');
}
@font-face {
  font-family: 'ultralight';
  src: url('/assets/font/montserrat/Montserrat-UltraLight.ttf') format('truetype'),
  src: url('../font/montserrat/Montserrat-UltraLight.woff') format('woff');
}

＆＃13;

＆＃13;

＆＃13;

Answer 1

您的字体路径错误，请删除资产＆＃39;在＆＃39; truetype＆＃39;的路径中试试这个

src: url('../font/montserrat/Montserrat-Black.ttf') fromat('truetype'),

你的甲酸也错了，试试这个甲酸盐

＆＃13;

＆＃13;

@font-face {
  font-family: 'Montserrat';
  src: url('../font/montserrat/Montserrat-Black.woff') format('woff'),
       url('../font/montserrat/Montserrat-Black.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

＆＃13;

＆＃13;

＆＃13;

Answer 2

问题涉及CSS文件中的src属性。看看以下截图：

正如您在下面的屏幕截图中看到的，解析“src”的值（在文件style.css中）有错误。

1）修复遵循W3S site上定义的规则的那些。

2）在你的style.css中，给你的规则和font-weight指定正确的名称，以表示字体“粗体”等值。

3）对于未来，我建议您使用浏览器中的开发人员工具来检测此类问题。