HTML 属性：rel

rel 属性定义链接资源和当前文档之间的关系。在 <link>、<a>、<area> 和 <form> 上有效，支持的值取决于在其上找到该属性的元素。

¥The rel attribute defines the relationship between a linked resource and the current document. Valid on <link>, <a>, <area>, and <form>, the supported values depend on the element on which the attribute is found.

关系类型由 rel 属性的值给出，该属性（如果存在）的值必须是一组无序的唯一空格分隔关键字。与不表达语义的 class 名称不同，rel 属性必须表达对机器和人类在语义上都有效的标记。rel 属性的可能值的当前注册表是 IANA 链接关系注册表、HTML 生活标准 和微格式 wiki 中可自由编辑的 现有相对值页面，以及 Living Standard 中的 按照建议。如果使用上述三个来源之一中不存在的 rel 属性，某些 HTML 验证器（例如 W3C 标记验证服务）将生成警告。

¥The type of relationships is given by the value of the rel attribute, which, if present, must have a value that is an unordered set of unique space-separated keywords. Differently from a class name, which does not express semantics, the rel attribute must express tokens that are semantically valid for both machines and humans. The current registries for the possible values of the rel attribute are the IANA link relation registry, the HTML Living Standard, and the freely-editable existing-rel-values page in the microformats wiki, as suggested by the Living Standard. If a rel attribute not present in one of the three sources above is used some HTML validators (such as the W3C Markup Validation Service) will generate a warning.

下表列出了一些最重要的现有关键字。空格分隔值中的每个关键字在该值中应该是唯一的。

¥The following table lists some of the most important existing keywords. Every keyword within a space-separated value should be unique within that value.

rel 值 描述 <link> <a> and <area> <form>
alternate 当前文档的替代表示形式。 关联 关联 不允许
author 当前文档或文章的作者。 关联 关联 不允许
bookmark 最近祖级部分的永久链接。 不允许 关联 不允许
canonical 当前文档的首选 URL。 关联 不允许 不允许
dns-prefetch 告诉浏览器抢先对目标资源的来源进行 DNS 解析。 外部资源 不允许 不允许
external 引用的文档与当前文档不属于同一站点。 不允许 注解 注解
expect 允许页面处于 render-blocked 状态，直到解析文档的基本部分，以便始终一致地呈现。 关联 不允许 不允许
help 链接到上下文相关帮助。 关联 关联 关联
icon 代表当前文档的图标。 外部资源 不允许 不允许
license 表示当前文档的主要内容受到引用文档描述的版权许可的保护。 关联 关联 关联
manifest Web 应用清单。 关联 不允许 不允许
me 指示当前文档代表链接内容的所有者。 关联 关联 不允许
modulepreload 告诉浏览器抢先获取脚本并将其存储在文档的模块映射中以供以后评估。或者，也可以获取模块的依赖。 外部资源 不允许 不允许
next 指示当前文档是系列的一部分，并且该系列中的下一个文档是引用的文档。 关联 关联 关联
nofollow 表示当前文档的原始作者或发布商不认可引用的文档。 不允许 注解 注解
noopener 如果超链接首先会创建其中任何一个（即具有适当的 target 属性值），则创建一个不是辅助浏览上下文的顶层浏览上下文。 不允许 注解 注解
noreferrer 不会包含 Referer 标头。另外，与 noopener 具有相同的效果。 不允许 注解 注解
opener 如果超链接将创建一个不是辅助浏览上下文的顶层浏览上下文（即，具有“_blank”作为 target 属性值），则创建辅助浏览上下文。 不允许 注解 注解
pingback 给出处理当前文档的 pingback 的 pingback 服务器的地址。 外部资源 不允许 不允许
preconnect 指定用户代理应抢先连接到目标资源的源。 外部资源 不允许 不允许
prefetch 指定用户代理应抢先获取并缓存目标资源，因为后续导航可能需要该资源。 外部资源 不允许 不允许
preload 指定用户代理必须根据 as 属性给出的潜在目的地（以及与相应目的地关联的优先级）抢先获取并缓存当前导航的目标资源。 外部资源 不允许 不允许
prerender 指定用户代理应抢先获取目标资源并以有助于将来提供更快响应的方式对其进行处理。 外部资源 不允许 不允许
prev 指示当前文档是系列的一部分，并且该系列中的上一个文档是引用的文档。 关联 关联 关联
privacy-policy 提供指向有关适用于当前文档的数据收集和使用实践的信息的链接。 关联 关联 不允许
search 提供指向资源的链接，可用于搜索当前文档及其相关页面。 关联 关联 关联
stylesheet 导入样式表。 外部资源 不允许 不允许
tag 给出适用于当前文档的标签（由给定地址标识）。 不允许 关联 不允许
terms-of-service 指向文档提供者和希望使用该文档的用户之间的协议或服务条款的链接。 关联 关联 不允许

rel 属性与 <link>、<a>、<area> 和 <form> 元素相关，但某些值仅与这些元素的子集相关。与所有 HTML 关键字属性值一样，这些值不区分大小写。

¥The rel attribute is relevant to the <link>, <a>, <area>, and <form> elements, but some values only relevant to a subset of those elements. Like all HTML keyword attribute values, these values are case-insensitive.

rel 属性没有默认值。如果省略该属性或者如果该属性中的任何值都不受支持，则该文档与目标资源没有特定关系，除了两者之间存在超链接之外。在这种情况下，在 <link> 和 <form> 上，如果 rel 属性不存在，没有关键字，或者没有一个或多个上述空格分隔的关键字，则该元素不会创建任何链接。<a> 和 <area> 仍将创建链接，但没有定义的关系。

¥The rel attribute has no default value. If the attribute is omitted or if none of the values in the attribute are supported, then the document has no particular relationship with the destination resource other than there being a hyperlink between the two. In this case, on <link> and <form>, if the rel attribute is absent, has no keywords, or if not one or more of the space-separated keywords above, then the element does not create any links. <a> and <area> will still created links, but without a defined relationship.

值

¥Values

alternate

指示当前文档的替代表示形式。对 <link>、<a> 和 <area> 有效，含义取决于其他属性的值。

  • 在 <link> 上使用 stylesheet 关键字，它会创建一个 替代样式表。
    html
    <!-- a persistent style sheet -->
<link rel="stylesheet" href="default.css" />
<!-- alternate style sheets -->
<link
  rel="alternate stylesheet"
  href="highcontrast.css"
  title="High contrast" />
  • hreflang 属性与文档语言不同，表示翻译。
  • 使用 "application/rss+xml" 或 "application/atom+xml" 的 type 属性值，它会创建引用聚合提要的超链接。
    html
    <link
  rel="alternate"
  type="application/atom+xml"
  href="posts.xml"
  title="Blog" />
  • 否则，它会创建一个引用当前文档的替代表示的超链接，其性质由 hreflang 和 type 属性给出。
    • 如果 hreflang 与 alternate 一起给出，并且 hreflang 的值与当前文档的语言不同，则表明引用的文档是翻译。
    • 如果 type 与 alternate 一起给出，则表明引用的文档是替代格式（例如 PDF）。
    • hreflang 和 type 属性都可以与 alternate 一起给出。
    html
    <link
  rel="alternate"
  href="/fr/html/print"
  hreflang="fr"
  type="text/html"
  media="print"
  title="French HTML (for printing)" />
<link
  rel="alternate"
  href="/fr/pdf"
  hreflang="fr"
  type="application/pdf"
  title="French PDF" />
author

表示引用的文档提供了有关当前文档或文章作者的更多信息。与 <link>、<a> 和 <area> 元素相关。

对于 <a> 和 <area>，它表示链接文档（或 mailto:）提供有关最近的 <article> 祖级的作者的信息（如果有的话），否则提供整个文档。

<link> 代表整个文档的作者。

注意：由于历史原因，过时的属性值 rev="made" 被视为 rel="author"。

¥Note: For historical reasons, the obsolete attribute value rev="made" is treated as rel="author".

bookmark

与 <a> 和 <area> 元素的 rel 属性值相关。给出最近的祖级 <article> 元素的永久链接（如果有）。如果没有祖级 <article> 元素，则为与链接元素最密切相关的部分提供永久链接。

canonical

对 <link> 有效，它定义当前文档的首选 URL，这有助于搜索引擎减少重复内容。

dns-prefetch

与 <body> 和 <head> 中的 <link> 元素相关，它告诉浏览器抢先对目标资源的来源执行 DNS 解析。对于用户可能需要的资源很有用，它有助于减少延迟，从而提高用户访问资源时的性能，因为浏览器会抢先对指定资源的来源执行 DNS 解析。参见 资源提示 中描述的 dns-prefetch。

external

与 <form>、<a> 和 <area> 相关，表示引用的文档不属于当前站点。这可以与属性选择器一起使用，以向用户指示他们将离开当前站点的方式设置外部链接的样式。

expect

允许页面处于 render-blocked 状态，直到解析文档的基本部分，以便始终一致地呈现。请注意，仅在补充 blocking="render" 属性时才会发生渲染阻塞。

注意：有关其使用的更多信息，请参阅 稳定页面状态以使跨文档转换一致。

¥Note: See Stabilizing page state to make cross-document transitions consistent for more information on its use.

help

与 <form>、<link>、<a> 和 <area> 相关，help 关键字指示链接到的内容提供上下文相关的帮助，为定义超链接的元素的父元素及其子元素提供信息。在 <link> 内使用时，帮助针对整个文档。当与 <a> 和 <area> 一起包含并受支持时，默认 cursor 将为 help 而不是 pointer。

icon

对 <link> 有效，链接的资源表示当前文档的图标，即用于表示用户界面中的页面的资源。

icon 值最常见的用途是网站图标：

html
<link rel="icon" href="favicon.ico" />

如果有多个 <link rel="icon">，浏览器将使用它们的 media、type 和 sizes 属性来选择最合适的图标。如果多个图标同样合适，则使用最后一个。如果后来发现最合适的图标不合适，例如因为它使用了不受支持的格式，则浏览器将继续使用下一个最合适的图标，依此类推。

注意：基于 Chromium 的浏览器中的 rel="icon" 不支持 crossorigin 属性。参见 打开 Chromium 问题。

¥Note: The crossorigin attribute is not supported for rel="icon" in Chromium-based browsers. See the open Chromium issue.

注意：Apple 的 iOS 不使用此链接类型，也不像其他移动浏览器那样使用 sizes 属性来选择 Web Clip 的网页图标或启动占位符。相反，它分别使用非标准 apple-touch-icon 和 apple-touch-startup-image。

¥Note: Apple's iOS does not use this link type, nor the sizes attribute, like others mobile browsers do, to select a webpage icon for Web Clip or a start-up placeholder. Instead it uses the non-standard apple-touch-icon and apple-touch-startup-image respectively.

注意：shortcut 链接类型在 icon 之前经常出现，但这种链接类型是不合格的，被忽略，网络作者不得再使用它。

¥Note: The shortcut link type is often seen before icon, but this link type is non-conforming, ignored and web authors must not use it anymore.

license

对 <a>、<area>、<form>、<link> 元素有效，license 值表示超链接指向描述许可信息的文档；当前文档的主要内容受到引用文档描述的版权许可的保护。如果不在 <head> 元素内，则该标准不会区分应用于文档特定部分或整个文档的超链接。只有页面上的数据才能表明这一点。

html
<link rel="license" href="#license" />

注意：尽管已被识别，但同义词 copyright 是不正确的，必须避免。

¥Note: Although recognized, the synonym copyright is incorrect and must be avoided.

manifest

Web 应用清单。需要使用 CORS 协议进行跨域抓取。

modulepreload

对于提高性能很有用，并且与文档中任何位置的 <link> 相关，设置 rel="modulepreload" 告诉浏览器抢先获取脚本（和依赖）并将其存储在文档的模块映射中以供以后评估。modulepreload 链接可以确保在模块映射中的模块准备好（但未评估）的情况下完成网络获取，然后才需要它。另见 modulepreload。

next

与 <form>、<link>、<a> 和 <area> 相关，next 值指示当前文档是系列的一部分，并且系列中的下一个文档是引用的文档。当包含在 <link> 中时，浏览器可能会假设接下来将获取文档，并将其视为资源提示。

nofollow

与 <form>、<a> 和 <area> 相关，nofollow 关键字告诉搜索引擎蜘蛛忽略链接关系。nofollow 关系可能表明当前文档的所有者不认可所引用的文档。它经常被搜索引擎优化者包含，假装他们的链接场不是垃圾邮件页面。

noopener

与 <form>、<a> 和 <area> 相关，如果超链接将创建其中任何一个（即具有适当的 target 属性值），则创建一个不是辅助浏览上下文的顶层浏览上下文。换句话说，它使链接的行为就像 window.opener 为空并且 target="_parent" 已设置一样。

这与 opener 相反。

noreferrer

与 <form>、<a> 和 <area> 相关，包含此值会使引荐来源网址未知（不会包含 Referer 标头），并创建顶层浏览上下文，就像还设置了 noopener 一样。

opener

如果超链接将创建一个不是辅助浏览上下文的顶层浏览上下文（即，具有“_blank”作为 target 属性值），则创建辅助浏览上下文。实际上，与 noopener 相反。

pingback

给出处理当前文档的 pingback 的 pingback 服务器的地址。参见 Pingback 规范。

preconnect

向浏览器提供提示，建议其提前打开与链接网站的连接，而不会泄露任何私有信息或下载任何内容，以便在点击链接时可以更快地获取链接内容。

prefetch

指定用户代理应抢先获取并缓存目标资源，因为后续导航可能需要该资源。请参阅 prefetch 了解更多信息。

preload

指定用户代理必须根据 as 属性给出的潜在目的地（以及与相应目的地关联的优先级）抢先获取并缓存当前导航的目标资源。请参阅 preload 值页面。

prerender

指定用户代理应抢先获取目标资源并以有助于将来提供更快响应的方式对其进行处理，例如通过获取其子资源或执行某些渲染。

prev

与 next 关键字类似，与 <form>、<link>、<a> 和 <area> 相关，prev 值指示当前文档是系列的一部分，并且引用该系列中先前文档的链接是被引用文档。

注意：同义词 previous 不正确，不应使用。

privacy-policy

对于 <a>、<area> 和 <link> 元素有效，privacy-policy 值表示引用的文档是隐私政策，描述当前文档的数据收集和使用实践。

与 <form>、<link>、<a> 和 <area> 元素相关，search 关键字表示超链接引用了一个文档，该文档的界面是专门为在当前文档、站点和相关资源中搜索而设计的，提供了可以使用的资源的链接 寻找。

如果 type 属性设置为 application/opensearchdescription+xml，则该资源是一个 OpenSearch 插件，可以轻松添加到 Firefox 的界面中。

stylesheet

对于 <link> 元素有效，它导入外部资源以用作样式表。如果是 text/css 样式表，则不需要 type 属性，因为这是默认值。如果它不是 text/css 类型的样式表，最好声明该类型。

虽然此属性将链接定义为样式表，但与 rel 值中的其他属性和其他关键术语的交互会影响样式表是否被下载和/或使用。

当与 alternate 关键字一起使用时，它定义一个替代样式表。在这种情况下，请包含非空 title。

如果媒体与 media 属性的值不匹配，则不会使用外部样式表，甚至不会下载外部样式表。

需要使用 CORS 协议进行跨域抓取。

tag

对于 <a> 和 <area> 元素有效，它给出一个适用于当前文档的标记（由给定地址标识）。标签值表示链接引用了描述应用于其所在文档的标签的文档。此链接类型不适用于标签云中的标签，因为这些标签适用于一组页面，而 rel 属性的 tag 值适用于单个文档。

terms-of-service

对于 <a>、<area> 和 <link> 元素有效，terms-of-service 值表示引用的文档是服务条款，描述当前文档的提供者与希望使用所提供文档的用户之间的协议。

非标准值

¥Non-standard values

apple-touch-icon

指定 iOS 设备上 Web 应用的图标。

规范

Specification
HTML Standard
# linkTypes
HTML Standard
# attr-hyperlink-rel
HTML Standard
# attr-form-rel

¥Specifications

浏览器兼容性

¥Browser compatibility

html.elements.link.rel

BCD tables only load in the browser

html.elements.a.rel

BCD tables only load in the browser

html.elements.area.rel

BCD tables only load in the browser

html.elements.form.rel

BCD tables only load in the browser

也可以看看

¥See also