Javascript 如何在html和css中使用不常见的字体

我想在html中使用一些不常见的字体，但无法使它们正常工作。例如，我想使用Kollekif字体类型，但它不起作用

p、 b{
字体系列：“Kollekif”，时代，衬线；
}
p、 a{
字体系列：Arial、Helvetica、无衬线字体；
}
这项工作适用于Arial字体
我如何制作这种字体的Kollekif

要包含自定义字体，您需要包含可加载该字体的资源

例如，如果下载Kollekif并将其托管在html所在的字体文件夹中：

@font-face {
  font-family: "Kollekif";
  src: url("/fonts/Kollekif-webfont.woff2") format("woff2"),
       url("/fonts/Kollekif-webfont.woff") format("woff");
}

---

您需要导入字体，或者从文件导入，或者从Google字体导入

@import url(https://fonts.googleapis.com/css?family=Bungee);

---

根据您的目标浏览器，您可以使用@font-face。您可以在此处了解更多信息：

如果将字体下载到与HTML页面相同的文件夹中，则可以使用以下代码（我假设字体保存为Kollektif.ttf）

@字体{
字体系列：myFont；
src:url（Kollektif.ttf）；
}
p、 b{
字体系列：myFont；
}
p、 a{
字体系列：Arial、Helvetica、无衬线字体；
}

一种不常见的字体或非标准字体可能无法通过调用其名称直接使用。事实证明，科列基夫可能就是其中之一。要使用这些字体，您必须事先导入它们才能使用它们

现在我找不到特别是

Kollekif

的嵌入链接，所以我使用了另一种字体示例。你可以从中找到许多免费字体，但是如果你真的必须使用Kollekif，你可以添加字体文件（.ttf、.otf、.woff等），并使用它们的相对路径链接它们

p、 b{
字体家族：“龙仓”，时代，衬线；
}
p、 a{
字体系列：Arial、Helvetica、无衬线字体；
}
这项工作适用于Arial字体
我如何制作这种字体的Kollekif

要么使用谷歌字体，要么尝试使用谷歌字体。这是一个看起来几乎和Kollektif一模一样的。

<style>
@font-face {
   font-family: myFont;
   src: url(Kollektif.ttf);
}

p.b {
   font-family: myFont;
}

p.a {
  font-family: Arial, Helvetica, sans-serif;
}
</style>