reveal.js - 本地提供本地提供的字体

Question

我最近在我的reveal.js 演示文稿中使用默认的google-fonts URL 字体，因为我不得不重新加载浏览器（切换演示文稿），并且没有Wifi，字体缓存会丢失并且不会'不会被重建，因此我最终得到了一个看起来很糟糕的默认无衬线字体。

所以。我想包含reveal.js 演示文稿的字体，在我的笔记本电脑上通过npm start 和127.0.0.1:8000 运行本地，以便浏览器在本地找到字体就像它找到 html 和 css 一样，不需要 Internet 访问。

这是我的自定义方案中的内容：

@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,400;0,700;1,400;1,700&display=swap');

// Override theme settings (see ../template/settings.scss)
$mainFont: 'Roboto Condensed', sans-serif;
$headingFont: 'Roboto Condensed', sans-serif;
...

如何下​​载必要的字体，如何更改此方案以使用本地字体？

Answer 1

你不能在这里简单地抓住字体https://github.com/davidcunningham/roboto-condensed/tree/master/fonts

然后将其添加到您的样式表中？

@font-face {
  font-family: 'RobotoCondensed-Regular';
  src: url('/path/to/fonts/RobotoCondensed-Regular.woff') format('woff')
}

然后以你的风格调用它

font-family:'RobotoCondensed-Regular';

**对每个字体粗细重复，因为此字体不可变。