HTML 链接标签
2025-05-14
5️⃣ HTML5 新属性
⚠️ 大多数浏览器不支持
<a>
- 定义超链接,用于从一个页面链接到另一个页面。
- 最重要的属性是 href 属性,它指定链接的目标。
| 属性名 | 值 | 说明 |
|---|---|---|
| download5️⃣ | filename | 指定下载链接,该属性需要下载资源是同源的。 |
| href | URL | 规定链接的目标 URL。 |
| hreflang | language_code | 规定目标 URL 的基准语言。仅在 href 属性存在时使用。 |
| media5️⃣ | media_query | 规定目标 URL 的媒介类型。默认值:all。仅在 href 属性存在时使用。 |
| rel5️⃣ | alternate 文档的替代版本(比如打印页、翻译或镜像)。 author 链接到文档的作者。 bookmark 用于书签的永久网址 help 链接到帮助文档 license 链接到文档的版权信息。 next 选项中的下一个文档 nofollow nofollow 是一个HTML标签的属性值。这个标签的意义是告诉搜索引擎"不要追踪此网页上的链接"或"不要追踪此特定链接。 noreferrer 如果用户点击链接指定浏览不要发送 HTTP referer 头部信息。 prefetch 指定的目标文件应该被缓存 prev 选项中的前一个文档 search 文档链接到搜索工具 tag 当前文档的标签(关键词) | 当前文档与被链接文档之间的关系 |
| type5️⃣ MIME_type | 规定目标 URL 的 MIME 类型。 注:MIME = Multipurpose Internet Mail Extensions。 | |
| sizesNew | HeightxWidth any | 定义了链接属性大小,只对属性 rel="icon" 起作 |
| target | _blank 新窗口打开 _self 当前窗口打开 _parent 父窗口打开 _top 顶层窗口打开 | 规定在何处打开 action URL。 |
<a href="/error.mp3" download="error.mp3">下载图片</a><link>
- 定义文档与外部资源的关系。
- 最常见的用途是链接样式表。
| 属性名 | 值 | 说明 |
|---|---|---|
| href | URL | 定义被链接文档的位置。 |
| hreflang | language_code | 定义被链接文档中文本的语言。。 |
| media | media_query | 规定被链接文档将显示在什么设备上。 |
| rel | alternate 链接到该文档的替代版本(比如打印页、翻译或镜像)。 author 链接到该文档的作者。 help 链接到帮助文档。 icon 导入表示该文档的图标。 license 链接到该文档的版权信息。 next 表示该文档是集合中的一部分,且集合中的下一个文档是被引用的文档。 prefetch 规定应该对目标资源进行缓存。 prev 表示该文档是集合中的一部分,且集合中的上一个文档是被引用的文档。 search 链接到针对文档的搜索工具。 stylesheet 要导入的样式表的 URL。 | 必需。定义当前文档与被链接文档之间的关系 |
| type5️⃣ | MIME_type | 规定目标 URL 的 MIME 类型。 注:MIME = Multipurpose Internet Mail Extensions。 |
<main>
- 用于指定文档的主体内容
- 在文档中是唯一的。它不应包含在文档中重复出现的内容,比如侧栏、导航栏、版权信息、站点标志或搜索表单。
| 属性名 | 值 | 说明 |
|---|
<main>
<h1>Web 浏览器</h1>
<p>Google Chrome、Firefox 以及 Internet Explorer 是目前最流行的浏览器。</p>
<article>
<h1>Google Chrome 浏览器</h1>
<p>Google Chrome 浏览器是由 Google 开发的一款免费的开源 web 浏览器,于 2008 年发布。</p>
</article>
<article>
<h1>Internet Explorer 浏览器</h1>
<p>Internet Explorer 浏览器由微软开发的一款免费的 web 浏览器,发布于 1995 年。</p>
</article>
<article>
<h1>Mozilla Firefox 浏览器</h1>
<p>Firefox 浏览器是一款来自 Mozilla 的免费开源 web 浏览器,发布于 2004 年。</p>
</article>
</main><nav> 5️⃣
- 定义导航链接的部分
<nav>
<a href="/html/">HTML</a> |
<a href="/css/">CSS</a> |
<a href="/js/">JavaScript</a> |
<a href="/jquery/">jQuery</a>
</nav>