字体不显示？

Question

我几乎 100% 确定我所做的是完全正确的这是我目前所知道的：

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="homepage.css"/>

</head>
<body>
    <div id="menu">
        <p>THE BIG BLUE SITE OF SAILING KNOWLEDGE</p>
    </div>
</body>
</html>

CSS:

@font-face: {font-family: "ostrich-reg"; src: url('Fonts/ostrich-regular-webfont.ttf'); }
@font-face: {font-family: "ostrich-light"; src: url("Fonts/ostrich-light.ttf"); }
@font-face: {font-family: "collab"; src: url("Fonts/ColabThi.otf"); }

#menu {
    position: fixed;
    top: 0px;
    left: 0px;
    bottom: 0px;
    height: 100vh;
    width: 27%;
    background: #2d5dac;
    text-align: center;
}

#menu p {
    color: white;
    font-family: ostrich-reg;
    font-size: 60px;
}

那里真的没有多少东西，没有太多错误的余地，所以我认为这是我的文件。我从 Font Squirrel 那里得到了这个文件，据我所知这是一个非常可靠的来源（我之前已经用过几次），但为了好玩我通过他们的 webfont 生成器运行它仍然没用。此外，我直接尝试使用另一个文件并得到相同的结果（它也是另一种格式 - .0tf）。所以我不知道。有什么建议吗？

顺便说一下，我知道这在 IE 上不起作用，我今天才开始制作网站，我还不太关心这个。

以下是我尝试过滤字体时发生的情况：

所以，只要我做对了，我就很确定这意味着没有加载字体。这很奇怪，因为我很确定路径确实是正确的......字体文件夹与 .html 文件位于同一文件夹中，字体直接位于字体文件夹中。

Answer 1

我在我的一个项目中使用了这种字体。我在我的 CSS 文件中使用了类似的东西（我仍然只以这种方式使用我的所有字体）

CSS

@font-face {
    font-family: 'OstrichSansCondensedLight';
    src: url('ostrich-light-webfont.eot');
    src: url('ostrich-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('ostrich-light-webfont.woff') format('woff'),
         url('ostrich-light-webfont.ttf') format('truetype'),
         url('ostrich-light-webfont.svg#OstrichSansCondensedLight') format('svg');
    font-weight: normal;
    font-style: normal;

}

但我使用了 .eot、.woff、.ttf、.svg 文件。是的，它在 IE8+ 上工作，因为我使用了 src: url('ostrich-light-webfont.eot?#iefix') format('embedded-opentype'),

如果您遇到任何问题或缺少任何字体文件，请告诉我，我可以尝试为您找到。

字体不显示？

Font Not Showing Up?

css

fonts

font-face