Question

我正在尝试使用github页面制作一个网站，并且我想添加otf字体。我无法使其正常工作，也不确定要怎么做。

我已经进行了一些研究，发现我需要使用@ font-face，但我无法弄清楚它应该如何工作。在大多数其他解决方案中，我发现人们正在使用Google托管其字体或类似的字体，但我希望将字体托管在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>

我希望这会有所帮助。

Answer 2

您只需添加另一个@ font-face规则：

@font-face {
    font-family: CustomFont;
    src: url('CustomFont.otf');
}

@font-face {
    font-family: CustomFont2;
    src: url('CustomFont2.otf');
}

将OTF字体添加到网页

2 个答案: