时间戳

首页 > 解决方案 > @font-face - 为一种字体使用多个文件

html - @font-face - 为一种字体使用多个文件

问题描述

似乎这个问题已经被问过很多次了（比如这里）。但是我的问题似乎并没有通过提供的答案得到解决。

我正在尝试对单个字体使用多个文件。每个文件都有不同的样式 - 斜体、粗体。我尝试了以下方法：

@font-face {
    font-family: matrix;
    src: url('../fonts/chris-simpkins_hack/Hack-Regular.ttf');
}
@font-face {
    font-family: matrix;
    font-weight: bold;
    src: url('../fonts/chris-simpkins_hack/Hack-Bold.ttf');
}

我的 HTML 包含以下内容：

<h1>Some Text</h1>
<p><b>Some more text that is bold!</b></p>

出乎意料的是，页面上输出的所有文本都使用了“...bold.tff”文件。为什么是这样？

过去我能够轻松快速地实现这一目标，但不确定这次有什么不同。

标签： htmlcss

解决方案

默认情况下，h1 使用粗体文本。有关详细信息，请参阅W3School。

只需添加h1{ font-weight: normal;}即可重置。

如果你不喜欢浏览器默认的 css，你可以使用一些 reset.css 或normalize.css。

但是， normalize.css 也将 h1 视为粗体文本。

推荐阅读