使用手冊取消

CSS 選擇器

搜尋

上次更新時間 2021年4月29日

CSS 選擇器會告知瀏覽器要將您使用的網頁字體套用在何處，以及用於文字的字體之粗細和樣式。

在您的 CSS 中使用 font-family 名稱

「網頁專案」頁面會列出專案中每種字體的 CSS font-family 名稱、粗細數值和字體樣式。按一下「編輯專案」連結，即可檢視每個專案的 CSS 詳細資料。

當您在文件中包含內嵌程式碼之後，請在 CSS 中使用這些 font-family 名稱，將字體套用到文字。例如：

h1 {
  font-family: "brandon-grotesque", sans-serif;
}

如果用戶的瀏覽器不支援網頁字體或者因為任何原因而無法載入網頁字體，則將改用 CSS 堆疊中的備用字體。

字體堆疊應該至少包含在所有平台中統一可用的一種備用字體 (例如 Georgia 或 Arial)，後面緊接著通用 font-family 名稱 (例如 serif 或 sans-serif)。如果瀏覽器找不到第一種字體，它將嘗試第二種字體，依此類推。

您可以在 CSS 中使用字體粗細數值來指定「標準」和「粗體」以外的字體粗細。這些數值最常對應到以下粗細：

您可以在「網頁專案」頁面上找到您專案中所有字體的數值。

例如，使用此 CSS 可將 700 粗細的字體套用到 h1 元素：

h1 {
  font-weight: 700;
}

Internet Explorer 8 對於每個系列最多會載入四種粗細，使用兩種緊密相關的粗細 (例如 600 和 700) 可能只會正確載入一種粗細。Adobe Fonts 會將變體專屬的 font-family 名稱提供給這些瀏覽器版本，以管理這兩個錯誤。

變體專屬的名稱應該視需要新增到 font-family 堆疊的開頭 (在主要系列名稱前面)：

#post-title {
  font-family: "brandon-grotesque-n7","brandon-grotesque", sans-serif;
  font-style: normal;
  font-weight: 700;
}

這些名稱是由一般 font-family 名稱組成，後面依序緊接著破折號和字體變體說明 (或稱為 FVD)。例如，包含 700 粗細字體的 brandon-grotesque 的變體專屬名稱為 brandon-grotesque-n7。

沒有這些問題的瀏覽器中將不會定義變體專屬名稱，所以這些瀏覽器將會使用堆疊中排在第二位的完整系列名稱。

大多數用戶不需要使用這些額外的 font-family 名稱。只有當您在 Internet Explorer 8 中發現無法正確顯示字體時，才需要新增這些名稱。

新的使用者？