html - 自定义字体未在 Chrome 中显示

Question

我在 Ubuntu 18.04 服务器上安装了一些自定义字体。它们在 Firefox 中正确呈现，但在 Chrome 中不正确。经过研究，我找到了一个答案，说在我的 css 中包含一个单独的@font-face。

我当前的@font-face 是:

@font-face{
    font-family: (font-name);
    src: local(font-name);
}

他们说我应该像这样添加另一个@font-face:

@font-face{
    font-family: (font-name);
    src: url('../font-name.ttf');
}

我的问题是:

1. 这个答案是否正确，或者是否有其他方法可以让自定义字体加载到 Chrome 中？

2. Ubuntu 18.04 中字体缓存的路径是什么？

谢谢。

Answer 1

对于初学者，您可以只使用速记。

@font-face{
    font-family: (font-name);
    src: local(font-name), 
         url('../font-name.ttf');
}

这将指示浏览器优先使用用户安装的字体副本(如果可用(本地))，如果在用户设备上找不到，则回退到下载字体副本(url)。 url 值可以是相对值或绝对路径——在这种情况下，字体文件必须位于 css 文件的父目录中。