html - 字体系列不变

Question

我已经下载了 Twitch 字体，即 Twitchy.TV。我正在尝试使用它，但是当我键入字体时，它无法识别它。

我认为这可能是因为 Twitchy (.) 电视。这段时间搞砸了。

我试过用“”或''来表示。

<div class="navigation">
    <div class="left">
        <img src="Logo.png" id="logoImage">
        <h1>TWITCH</h1>
    </div>
</div>

.left h1 { font-size: 22px; color: #fff; font-family: Twitchy.TV; }

Answer 1

您是否在 CSS 中包含了 @font-face 声明？

如今在网络上使用字体的最佳格式是 .woff 或 woff2 文件，如果您没有这种格式的字体，那么有很多提供网络字体转换器。

@font-face {
    font-family: 'Twitchy.TV';
    src: url('Twitchy.TV.woff2') format('woff2'),
         url('Twitchy.TV.woff') format('woff')
}

(假设您的字体文件位于与名为 Twitchy.TV.woff 和/或 Twitchy.TV.woff2 的样式表相同的目录中)

如果您只是在开发期间测试字体并在本地安装它，您可以像这样指定本地安装:

@font-face {
    font-family: 'Twitchy.TV';
    src: local('Twitchy.TV');
}

然后你就可以像这样使用它了:

.left h1 {
    font-family: 'Twitchy.TV';
}