Link 标签属性含义及其用法合集

link元素用于链接外部css样式表等其他相关外部资源。

1 link

其中link中包括如下属性。

• href：指明外部资源文件的路径，即告诉浏览器外部资源的位置
• hreflang：说明外部资源使用的语言
• media：说明外部资源用于哪种设备
• rel：必填，表明当前文档和外部资源的关系
• sizes：指定图标的大小，只对属性rel="icon"生效
• type：说明外部资源的MIME类型，如text/css、image/x-icon

2 rel

rel核心属性的参数值如下，也可参考 MDN。

• alternate：链接到文档的替代版本
• archives：链接到文档集或历史数据
• author：提供指向文档作者的链接
• bookmark：定义文档在收藏夹中显示的书签图标
• canonical：指明网站的规范版本
• dns-prefetch：指定浏览器预先执行目标资源的DNS解析
• external：链接到外部，即告知搜索引擎，此链接不是本站链接
• first：链接到集合中的首个文档
• help：链接帮助信息
• icon：定义网站或网页在浏览器标题栏中的图标
• license：链接到文档的版权信息
• last：链接到集合中的末个文档
• nofollow：指定文档不被搜索引擎跟踪，即某些页面不被爬虫抓取
• next：记录文档的下一页（浏览器可以提前加载此页）
• noreferrer：可以阻止浏览器发送访问来源信息
• preload：对资源进行预加载
• pingback：提供处理当前文档的pingback服务器地址
• prefetch：对资源进行预加载并缓存，通常preload用于加载当前页面的资源，而prefetch用于加载将来页面可能需要的资源
• preconnect：预先连接到目标资源的地址
• prev：记录文档的下一页
• search：链接到文档的搜索工具
• stylesheet：指定作为样式表的外部资源
• sidebar：指定浏览器边栏中显示的文档
• tag：指定当前文档使用的标签、关键词
• up：指向一个文档，此文档提供此网页的上下文关系

3 rel 应用

3.1 alternate

alternate可用于主题样式切换，将css作为预备样式，通过对link使用