rel="alternate stylesheet"
alternate stylesheet 關鍵字對，當用作 <link> 元素 rel 屬性的值時，表示目標資源是替代樣式表。在網頁中指定替代樣式表允許使用者根據他們的需求或偏好檢視頁面的多個版本。
注意： 在沒有擴充套件的情況下，瀏覽器對這個功能的支援並不好。要提供符合使用者現有偏好的替代呈現方式，請參閱 CSS 媒體特性 prefers-color-scheme 和 prefers-contrast。
Firefox 允許使用者透過檢視 > 頁面樣式子選單選擇替代 樣式表，該子選單會顯示 title 屬性的值。其他瀏覽器需要擴展才能啟用此功能。網頁也可以提供自己的使用者介面來讓使用者切換樣式。
示例
指定替代樣式表
替代樣式表使用帶有 rel="alternate stylesheet" 和 title="…" 屬性的 <link> 元素來指定。例如：
<link href="reset.css" rel="stylesheet" />
<link href="default.css" rel="stylesheet" title="Default Style" />
<link href="fancy.css" rel="alternate stylesheet" title="Fancy" />
<link href="basic.css" rel="alternate stylesheet" title="Basic" />
在此示例中，“預設樣式”、“花哨樣式”和“基本樣式”將在 Firefox 的頁面樣式子選單中列出，其中“預設樣式”是預選的。當用戶選擇不同的樣式時，頁面將立即使用該樣式表重新渲染。
無論選擇哪種樣式，reset.css 樣式表的規則將始終應用。
動手試試
詳情
文件中的任何樣式表都屬於以下類別之一：
- 永久樣式表 (具有
rel="stylesheet"，沒有title="")：始終應用於文件。 - 首選樣式表 (具有
rel="stylesheet"，並指定了title="…")：預設應用，但在選擇替代樣式表時會被 停用。只能有一個首選樣式表，因此提供具有不同 title 屬性的樣式表會導致其中一些被忽略。 - 替代樣式表 (
rel="alternate stylesheet"，並指定了title="…")：預設停用，可以選擇。
在存在樣式表選單的情況下，當使用 <link rel="stylesheet"> 或 <style> 元素的 title 屬性引用樣式表時，該 title 將成為使用者可選項之一。具有相同 title 的樣式表屬於同一選項。未帶 title 屬性連結的樣式表始終應用。
使用 rel="stylesheet" 連結到預設樣式，使用 rel="alternate stylesheet" 連結到替代樣式表。這會告訴瀏覽器哪個樣式表標題應該被預設選中，並在不支援替代樣式表的瀏覽器中應用該預設選擇。
規範
| 規範 |
|---|
| HTML # rel-alternate |
| HTML # the-link-is-an-alternative-stylesheet |
| HTML # attr-style-title |
| HTML # attr-meta-http-equiv-default-style |
| CSS 物件模型 (CSSOM) # css-style-sheet-collections |
瀏覽器相容性
載入中…