Css @字体不适用于github页面

我目前正试图解决我的投资组合网站的一个问题。我使用自定义字体来保持页面外观良好，但由于某些原因@font-face无法工作

以下是我的CSS：

@font-face{
font-family: 'Quicktype';
src: url('Fonts/quicktype_condensed-webfont.woff2') format('woff2'),
     url('Fonts/quicktype_condensed-webfont.woff') format('woff'),
     url('Fonts/QuickType Condensed.ttf') format('truetype'),
     url('Fonts/QuickType Condensed.eot'),
     url('Fonts/QuickType Condensed.eot?#iefix') format('embedded-opentype'),
     url('Fonts/QuickTypeCondensed.svg#QuickTypeCondensed') format('svg');
font-weight: normal;
font-style: normal;
}

以下是我的网站链接：

这里有一个指向我的github文件层次结构的链接

我尝试过使用尽可能多的字体文件类型，但在我使用的任何浏览器上都不起作用。我尝试了不同的字体目录路径，但似乎也不起作用。我也环顾四周，发现没有一个解决方案能解决我的问题

网站返回时总是会出现.ttf、.woff和.woff2字体的404错误（出于某种原因，不会出现其他字体），或者出现奇怪的GET错误

---

我知道我不能使用.htaccess文件，因为github页面只承载静态内容，不能执行服务器端逻辑。所以我有点不明白为什么会发生这种情况，以及如何解决它。如果您能提供帮助，请提前感谢。

我找到了解决方案！我使用的是绝对链接，而不是相对链接。相对链接使目标路径从当前使用的文件所在的位置开始，并且需要以“/”开头。绝对链接将从系统的根文件夹而不是文件的根文件夹开始指定的路径

在这里找到更多信息：coffeecup.com/help/articles/absolute-vs-relative-pathslinks‌​

---

此外，该解决方案归功于Frits

不相关的回答，以防有人遇到这个问题。如果您有任何以

\uu

开头的目录，例如webpack创建的目录：

/\uu/node\u modules/@fortawesome/…

，请确保在github pages分支/dir的根目录中有一个

.nojekyll

文件

---

以下是我检查过的其他解决方案的链接。下面是一张来自谷歌Chrome控制台的奇怪GET错误图片：尝试在URL的前面添加一个正斜杠？i、 e.

url（'font/quicktype\u condensed-webfont.woff2'）

变成

url（'/font/quicktype\u condensed-webfont.woff2'）

我这么说是因为[相对链接]（）需要以正斜杠开头，否则就我所知，浏览器会将链接解释为一个新的FQDN……这正是答案。考虑到我在这个问题上被困了多久，我觉得自己没有意识到这一点很傻。谢谢你的帮助！那你修改你的问题了吗？因为你的问题代码显示了相对链接。如果你发现了问题，不要更新你的帖子，突然显示“完美的代码”。这违背了stackoverflow的目的。不，我在上面使用的似乎是绝对链接，而不是绝对链接。我也没有编辑我的帖子，和我发布的时候一样@Frits帮助解决了这个问题，我所要做的就是在链接的开头加上一个“/”。啊：那正好相反。如果没有

/

，那些

url（）

是相对链接，特别是：相对于当前文档。因此，如果你在

www.cake.com

上，他们会指向

www.cake.com/font/..

，如果你在

www.cake.com/poundcake/

上，他们会指向

www.cake.com/poundcake/font/..

。添加

/

后，您的URL仍然是相对的，但现在是相对于域根的（因此在上述两种情况下，它们都指向

www.cake.com/Fonts/…

）。绝对URL指定完整的

http://.......

位置（或

https://

，或

//

表示绝对URL但相对协议，即“此页面使用的内容”）