在我的第一个网站使用Google字体URL后，我决定下载字体以离线渲染它们。我正在浏览W3学校和CSS技巧的页面，在CSS中设置@font-face，但我一定没有正确设置，因为有几种字体根本无法渲染，一种字体可以渲染，但不是我在CSS中指定的大小。我很难确定我的问题是什么，所以我想过来寻求帮助
下面是我的字体-字体CSS代码块。我不清楚是否需要为每种字体单独设置条目，因为我使用的转换器提供了一个包含单独条目的CSS工作表，所以我只是将它们全部粘贴到主工作表中。注意：对于src行，我确实尝试了在“fonts”之前使用站点主文件夹名称的路径，这似乎没有什么区别。

@font-face {
    font-family: 'Permanent Marker';
    src: 'fonts/permanent_marker/PermanentMarker-Regular.woff2' format('woff2'),
        'fonts/permanent_marker/PermanentMarker-Regular.woff' format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poor Story';
    src: 'fonts/poor_story/PoorStory-Regular.woff2' format('woff2'),
        'fonts/poor_story/PoorStory-Regular.woff' format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Rock Salt';
    src: 'rock_salt/RockSalt-Regular.woff2' format('woff2'),
        'fonts/rock_salt/RockSalt-Regular.woff' format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Sue Ellen Francisco';
    src: 'fonts/sue_ellen_francisco/SueEllenFrancisco.woff2' format('woff2'),
        'fonts/sue_ellen_francisco/SueEllenFrancisco.woff' format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Waiting for the Sunrise';
    src: 'fonts/waiting_for_the_sunrise/WaitingfortheSunrise.woff2' format('woff2'),
        'fonts/waiting_for_the_sunrise/WaitingfortheSunrise.woff' format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

这里有一个部分涵盖了我所有的标题的样式，后面是每个标题的单独样式。为了简洁，我在这里将它们分组在一起，尽管在实际的CSS表单中它们是分开的。

h1, h2, h3 {
  font-family: 'permanent marker';
  color: #301f1a;
  margin-top: 1.5em;
  text-align: left;
}

h1 {
  font: 5em;
  margin-left: 0.3em;
}

h2 {
  font: 2em/2.5;
}

h3 {
  font: 1.6em/2.9;
}

最后是常规文本。

p {
  font-family: 'waiting for the sunrise', 'sue ellen francisco', 'poor story'; 
  font: 1.5em;
  margin: 1.5em 4.5em;
  color: #301f1a;
}

.pagination {
  font-family: 'waiting for the sunrise', 'sue ellen francisco', 'poor story';
  font: 1.5em;
  margin: 1em 14em;
  color: #301f1a;
}

span {
  font-family: 'waiting for the sunrise', 'sue ellen francisco', 'poor story';
  font: 1.2em/1.5;
  color: #3d2b25;
  border-bottom-style: double;
}

目前，只有Permanent Marker字体呈现，但不是我在不同标题部分中指定的大小，它们看起来很小。对于其他所有内容，我只是获取BBEdit默认的系统字体，就好像没有指定字体一样。