html - 将 OTF 字体添加到网页

Question

我正在尝试制作一个带有 github 页面的网站，我想包含一个 otf 字体。我无法让它正常工作，我也不确定哪里出错了。

我做了一些研究，发现我需要使用@font-face，但我无法弄清楚它应该如何工作。在我发现的大多数其他解决方案中，我看到人们使用谷歌来托管他们的字体或类似的东西，但我更愿意将字体托管在我的 github 页面网站上。到目前为止，我已经下载了 otf 字体并将其添加到我的站点存储库中，我尝试按照其他一些指南进行操作，但没有成功。

目前我的站点存储库包含字体文件和 index.html 文件。

这是我的字体 CSS:

@font-face {
   font-family: MagnoliaScript;
   src: url("magnolia-script.otf") format("opentype");
}

我在这里尝试分配我添加到标题的字体:

<h1 face=MagnoliaScript>text</h1>

我按照我能在网上找到的内容进行操作，但我一定遗漏了一些东西，因为字体只是保持不变。

Answer 1

这里请尝试替换此代码段

<h1 face=MagnoliaScript>text</h1>

这里有这个:

<h1 style="font-family:MagnoliaScript;">text</h1>

希望对您有所帮助。