@ font-face没有得到正确的字体

Question

我在CSS中使用@ font-face标签时无法使用自定义字体。我有一个名为Project的文件夹，里面有文件夹fonts，css和images。我正在尝试使用@ font-face来使用自定义字体。

这是我的代码：

HTML - index.html

<div id="hello">Hello</div>

CSS - css / typography.css

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

#hello{
font-family: 'ranger';
font-size: 70px;
color: white;
text-align: center;
padding-top: 30px;
white-space: nowrap;
}

我将其用于其他多种字体，除了两种其他字体外，它们都可以使用。代码或字体文件类型没有区别。对于其中一种字体，它使用常规类型的面而不是我指定的面。另一个是使用浏览器默认值。这两种字体今天早上起作用，直到我将所有CSS移动到自己的文件夹中，并将所有字体移动到自己的文件夹中。

请帮忙！我是CSS / HTML的新手，所以我真的根本不理解这一点。

Answer 1

你的道路是错的。由于您的CSS文件位于/css/，因此您必须上一个目录才能访问/fonts/。

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