如何將 Google Fonts 合併到 CSS 樣式表中？

Question

我幾週前開始學習 CSS，並嘗試使用我在 Google Fonts 上找到的字體。即使我問了幾個朋友之後，我也不確定我的程式碼出了什麼問題。 （注意：我嘗試了 Chrome 和 Edge，但都不起作用）以下是包含字體並引用 CSS 表的 HTML 部分：

header {
  background-color: #4d4d4d;
  color: #FFFFFF;
  font-size: 5%;
  font-family: 'Alata', sans-serif;
}

<!-- Font Alata https://fonts.google.com/specimen/Alata -->

<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link href="https://fonts.googleapis.com/css2?family=ABeeZee&display=swap" rel="stylesheet"/>

</head>
<header>
  <link rel="stylesheet" href="style.css">
  this is a font test
  <link
  <a href="link to homepage">

    <img src="link to image" />
  </a>
</header>

我很高興知道這裡出了什麼問題。先致謝！

我嘗試使用 CSS 表使用 Google 字體，但該字體無法呈現

Answer 1

您正在要求字體 ABeeZee，但您在 CSS 中定義了 Atlanta。如果您想使用該字體，這些值必須符合

header {
  font-family: 'ABeeZee', sans-serif;
}

  
  this is a font test