css - 自定义字体未在 CSS 中加载

Question

我有一个链接到 main.css 的 index.html。根据关于 using custom fonts 的 SO 问题的答案之一，我通过将文件 FoundrySterling-Medium.otf 保存在适当的文件夹中，然后这样调用它来加载我的自定义字体:

@font-face{
    font-family: "FoundrySterling";
    src: "assets/fonts/FoundrySterling-Medium.otf",
}

稍后，对于 body 元素，我将其设置为:

body, input, select, textarea {
        color: #fff;
        font-family: 'FoundrySterling', sans-serif;
        font-size: 15pt;
        font-weight: 400;
        letter-spacing: 0.075em;
        line-height: 1.65em;
    }

但是无论如何，字体都不会显示，而是使用默认的 Helvetica 或 Arial(取决于 Mac 或 PC)。我错过了什么？

谢谢!

Answer 1

这是你的原始代码:

@font-face{
    font-family: "FoundrySterling";
    src: "assets/fonts/FoundrySterling-Medium.otf",
}

为什么不在末尾使用分号？不确定是否有意。

@font-face{
    font-family: "FoundrySterling";
    src: url("assets/fonts/FoundrySterling-Medium.otf");
}