面试系列：请说出Link中你知道的属性
💡
原文中文，约2200字，阅读约需6分钟。
📝
内容提要
HTML中的<link>标签用于建立文档与外部资源的关系，如样式表、网站图标、字体文件等。常用属性有href、hreflang、media、rel、sizes和type。其中rel属性的常用值有alternate、canonical、dns-prefetch、icon、next、nofollow、noreferrer、preload、prefetch、preconnect和stylesheet。这些属性分别用于指定替代版本、规范版本、DNS解析、图标、下一页、不被跟踪、不发送访问来源信息、预加载、预加载并缓存、预先连接和样式表。
🎯
关键要点
- <link>标签用于建立文档与外部资源的关系，如样式表、网站图标、字体文件等。
- 常用属性包括href、hreflang、media、rel、sizes和type。
- rel属性的常用值有alternate、canonical、dns-prefetch、icon、next、nofollow、noreferrer、preload、prefetch、preconnect和stylesheet。
- alternate属性用于指定当前文档的替代版本，通常用于多语言版本。
- canonical属性用于指定网站的规范版本，避免重复内容的问题。
- dns-prefetch属性用于预先执行目标资源的DNS解析，减少加载延迟。
- icon属性定义网站或网页在浏览器标题栏中的图标。
- next属性记录文档的下一页，浏览器可以提前加载此页。
- nofollow属性指定文档不被搜索引擎跟踪。
- noreferrer属性阻止浏览器发送访问来源信息。
- preload属性用于在页面渲染之前对资源进行预加载。
- prefetch属性用于对将来可能需要的资源进行预加载并缓存。
- preconnect属性用于预先连接到目标资源的地址。
- stylesheet属性指定作为样式表的外部资源。
❓
延伸问答
<link>标签的主要用途是什么？
<link>标签用于建立文档与外部资源的关系，如样式表、网站图标和字体文件等。
<link>标签中常用的属性有哪些？
常用属性包括href、hreflang、media、rel、sizes和type。
什么是rel属性，它的常用值有哪些？
rel属性表明当前文档与外部资源的关系，常用值有alternate、canonical、dns-prefetch、icon、next、nofollow、noreferrer、preload、prefetch、preconnect和stylesheet。
如何使用alternate属性？
alternate属性用于指定当前文档的替代版本，通常用于多语言版本的链接。
canonical属性的作用是什么？
canonical属性用于指定网站的规范版本，避免搜索引擎将多个地址视为相同内容的重复。
preload和prefetch属性有什么区别？
preload用于在页面渲染之前对资源进行预加载，而prefetch用于对将来可能需要的资源进行预加载并缓存。
➡️
