码农教程 - 一技在手,衣食无忧! tools

HTML <a> 标签

❮上一节 完整的 HTML参考 下一节❯

示例

创建到 91xjr.com 的链接：

<a href="https://www.91xjr.com">Visit 91xjr.com!</a>
亲自试一试 »

下面有更多 "亲自试一试" 示例。

定义和用法

这个<a>标签定义了一个超链接，用于从一个页面链接到另一个页面。

最重要的属性是<a>元素是 href属性，指示链接的目的地。

默认情况下，链接在所有浏览器中都会显示如下：

  • 未访问的链接带有下划线且呈蓝色
  • 访问过的链接带有下划线且呈紫色
  • 活动链接带有下划线并呈红色

提示和注释

提示：如果<a>标签没有 href属性，它只是超链接的占位符。

提示：链接页面通常显示在当前浏览器窗口中，除非您指定另一个目标。

提示：使用 CSS 设置链接样式：CSS 链接和CSS 按钮。

浏览器支持

Element
<a> Yes Yes Yes Yes Yes

属性

Attribute Value Description
download filename Specifies that the target will be downloaded when a user clicks on the hyperlink
href URL Specifies the URL of the page the link goes to
hreflang language_code Specifies the language of the linked document
media media_query Specifies what media/device the linked document is optimized for
ping list_of_URLs Specifies a space-separated list of URLs to which, when the link is followed, post requests with the body ping will be sent by the browser (in the background). Typically used for tracking.
referrerpolicy no-referrer
no-referrer-when-downgrade
origin
origin-when-cross-origin
same-origin
strict-origin-when-cross-origin
unsafe-url		 Specifies which referrer information to send with the link
rel alternate
author
bookmark
external
help
license
next
nofollow
noreferrer
noopener
prev
search
tag		 Specifies the relationship between the current document and the linked document
target _blank
_parent
_self
_top		 Specifies where to open the linked document
type media_type Specifies the media type of the linked document

全局属性

这个<a>标签还支持HTML 中的全局属性。

事件属性

这个<a>标签还支持HTML 中的事件属性。

更多示例

示例

如何使用图片作为链接：

<a href="https://www.91xjr.com">
<img border="0" alt="91xjr" src="logo_w3s.gif" width="100" height="100">
</a>
亲自试一试 »

示例

如何在新的浏览器窗口中打开链接：

<a href="https://www.91xjr.com" target="_blank">Visit 91xjr.com!</a>
亲自试一试 »

示例

如何链接到电子邮件地址：

<a href="mailto:someone@example.com">Send email</a>
亲自试一试 »

示例

如何链接到电话号码：

<a href="tel:+4733378901">+47 333 78 901</a>
亲自试一试 »

示例

如何链接到同一页面上的另一个部分：

<a href="#section2">Go to Section 2</a>
亲自试一试 »

示例

如何链接到 JavaScript：

<a href="javascript:alert('Hello World!');">Execute JavaScript</a>
亲自试一试 »

相关页面

HTML 教程：HTML 链接

HTML DOM 参考：锚定对象

CSS 教程：样式链接

默认 CSS 设置

大多数浏览器都会显示<a>具有以下默认值的元素：

a:link, a:visited {
  color: ( internal value);
  text-decoration: underline;
  cursor: auto;
}

a:link:active, a:visited:active {
  color: ( internal value);
}


❮上一节 完整的 HTML参考 下一节❯