新增字型

在 AMP 中，為了盡可能縮短文件載入時間，您無法加入外部樣式表。但這項規則有一個例外，那就是字型。

您可以使用兩種方式將自訂字型嵌入 AMP 網頁中

在本教學課程中，我們將使用 <link> 標記將字型新增至網頁。在 <head> 中加入樣式表連結，以要求 Raleway 字型

<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Raleway">

現在，更新您的 CSS body 選取器，以加入 Raleway 的參照

body {
  width: auto;
  margin: 0;
  padding: 0;
  font-family: 'Raleway', sans-serif;
}

重新整理您的網頁，並查看網頁的新外觀。此外，檢查 AMP 驗證工具的輸出內容。此外部樣式表要求不應有任何錯誤。

即使在速度很快的 AMP 網站上，網路字型仍可能對網站效能造成不利影響。請使用 font-display CSS 屬性，以最佳化字型的載入行為。

您已完成 AMP 新聞文章！以下是文章應有的外觀

已完成的新聞文章