A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from https://developer.mozilla.org/zh-CN/docs/Web/HTML/Reference/Attributes/rel/alternate_stylesheet below:

rel="alternate stylesheet" - HTMLï¼ˆè¶…æ–‡æœ¬æ ‡è®°è¯è¨€ï¼‰ | MDN

rel="alternate stylesheet"

Limited availability

alternate stylesheet 关键字对在作为 rel 属性值用于 <link> 元素时,表示目标资源为替代样式表。在网页中指定替代样式表可让用户根据自身需求或偏好查看页面的多个版本。

备注: 该功能在未安装扩展的浏览器中支持不佳。若需提供与用户现有偏好兼容的替代呈现方式,参见 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="默认样式" />
<link href="fancy.css" rel="alternate stylesheet" title="华丽" />
<link href="basic.css" rel="alternate stylesheet" title="基本" />

在此例中,页面样式菜单中会出现“默认样式”、“华丽”和“基本”的选项。“默认样式”默认选中。如果用户选择一个不同的样式,浏览器就使用用户选择的样式。

无论用户选择何种样式,reset.css 样式表中的规则都会始终应用。

试试看

在此尝试一个可运行的示例。

细节

文档的样式表分为三类:

当存在样式表菜单时,如果在 <link rel="stylesheet"> 或 <style> 元素上使用 title 属性引用样式表,则该标题将成为用户可选项之一。具有相同 title 的样式表属于同一选项。未指定 title 属性的样式表始终会被应用。

使用 rel="stylesheet" 链接到默认样式表,使用 rel="alternate stylesheet" 链接到替代样式表。这会告知浏览器应默认选择哪个样式表标题,并在不支持替代样式表的浏览器中应用该默认选择。

规范 浏览器兼容性 参见

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4