<link>

定义当前文档和外部资源之间的关系。最常用于链接到外部样式表或向网站添加图标。

可以在head元素、body元素中使用,但是最好在head元素中使用。

支持HTML全局属性和事件属性。

例子1:链接外部样式表

<head>

<link rel="stylesheet" type="text/css" href="mystyle.css">

</head>

 

例子2:链接网站图标。

<link rel="icon" type="image/x-icon" href="icon.jpg">

 

例子3:

<link

  rel="apple-touch-icon"

  sizes="114x114"

  href="apple-icon-114.png"

  type="image/png" />

 

 

属性

描述

crossorigin

·        anonymous

·        use-credentials

规定元素如何处理跨源请求。

anonymous

会发起一个跨源请求(即包含 Origin HTTP 标头),但不会发送任何认证信息(即不发送 cookie、X.509 证书和 HTTP 基本认证信息)。如果服务器没有给出源站凭证(不设置 Access-Control-Allow-Origin HTTP 标头),资源就会被污染并限制使用。

use-credentials

会发起一个带有认证信息(进行 cookie、X.509 证书和/或 HTTP 基本认证)的跨域请求(即包含 Origin HTTP 标头)。如果服务器没有给出源站凭证(不设置 Access-Control-Allow-Origin HTTP 标头),资源就会被污染并限制使用。 当不设置此属性时,资源将会不使用 CORS 加载(即不发送 Origin HTTP 标头),从而无法使用该资源。若设置了非法的值,则视为使用 anonymous。

 

href

URL

规定被链接文档的位置。

hreflang

语音代码      

规定被链接文档中文本的语言。

media

媒体查询      

规定被链接文档将在什么设备上显示。

referrerpolicy

·        no-referrer

·        no-referrer-when-downgrade

·        origin

·        origin-when-cross-origin

·        unsafe-url

 

规定获取资源时要使用哪个引用者。

rel

·        alternate

·        author

·        dns-prefetch

·        help

·        icon

·        license

·        next

·        pingback

·        preconnect

·        prefetch

·        preload

·        prerender

·        prev

·        search

·        stylesheet

 

必需。规定当前文档和被链接文档之间的关系。

sizes

·        HeightxWidth

·        any

规定被链接资源的尺寸。仅适用于 rel="icon"。

title

 

定义首选或备用样式表。

type

媒体类型,如text/css、text/html

规定被链接文档的媒体类型。