html - 如何在我的 HTML 中包含此字体？

Question

我在一个网页上发现了一种名为 Slim Joe 的漂亮字体，我在下面发布了该网页的链接。

即使我花了很多时间搜索他们的代码，我也找不到他们如何/在何处包含字体。我可以看到它在他们的 CSS 文件中使用(字体:Slim-Joe)，但我看不到它包含在他们的 html 中的什么地方。

有人可以帮我在我的 html 中包含这种字体吗？当我浏览 Google 提供的字体时(因为它们可以很容易地包含在我的 HTML 中)，我知道该做什么/它看起来如何，但我无法对这种特定字体做任何事情。

包含它的网页:

http://presentation.creative-tim.com/ (上面写着“创意蒂姆”)

字体的样子:

https://befonts.com/big-john-slim-joe-font.html

Answer 1

您可以通过 css @font-face 规则将字体包含到您的网站中。这需要您的服务器上有 otf 或 ttf 字体文件。要完成这项工作，您可以使用 font-family 属性来命名字体。这是您稍后将用来引用您下载的字体的内容。然后使用 src 将其映射到下载到计算机某处的 ttf 或 otf 文件。

像这样声明

@font-face {
  font-family: john-slim-joe;
  src: url(myFontsFolder/john-slim-joe.ttf);
}

像这样使用

p{
  font-family: john-slim-joe;
}