字体未加载到我的HTML页面

Question

我的CSS文件中有此代码。

style.css

@font-face {
  font-family: "KTishk";
  src: url('../fonts/KTishk.ttf');
  }

这是我网页的结构

• 根
  • index.html
  • 的CSS
    • style.css
  • 的字体
    • Tishk.ttf
  • 子文件夹
    • test.html

我的问题 ：在index.html页中，CSS和字体可以正确加载并正常工作，但是在test.html （位于子文件夹目录中）中，CSS可以加载但字体没有加载并且没有应用。

用于加载样式表的代码：

index.html

<link rel="stylesheet" href="css/style.css?version=2" >

test.html 

<link rel="stylesheet" href="../css/style.css?version=2" >

Answer 1

做这个

@font-face {
  font-family: Griffy;
  src: url(Griffy-Regular.ttf);
  font-style: italic;
}
body {
  font-family: 'Griffy', cursive;
}

您还需要指定bold，italic等作为参考， beautiful-fonts-with-font-face和w3-font-resource

Answer 2

您应该使用asbolute路径（以/开头）。 在您的情况下，这应该起作用：

@font-face {
  font-family: "KTishk";
  src: url('/fonts/KTishk.ttf');
}

检查此页面： https : //css-tricks.com/quick-reminder-about-file-paths/