什么是超链接?
超链接是互联网提供的最令人兴奋的创新之一,它们从一开始就一直是互联网的一个特性,使互联网成为互联的网络。超链接使我们能够将我们的文档链接到任何其他文档(或其他资源),也可以链接到文档的指定部分,我们可以在一个简单的网址上提供应用程序(与必须先安装的本地应用程序或其他东西相比)。几乎任何网络内容都可以转换为链接,点击(或激活)超链接将使网络浏览器转到另一个网址(URL)。
链接的解析
通过将文本(或其他内容,见块级链接)转换为<a>
元素内的链接来创建基本链接, 给它一个href
属性(也称为目标),它将包含您希望链接指向的网址。
<p>我创建了一个指向
<a href="https://www.mozilla.org/zh-CN/">Mozilla 主页</a>
的超链接。
</p>
结果如下所示:
我创建了一个指向 Mozilla 主页 的超链接。
使用title属性添加支持信息
您可能要添加到您的链接的另一个属性是标题;这旨在包含关于链接的补充有用信息,例如页面包含什么样的信息或需要注意的事情。 例如:
<p>我创建了一个指向
<a href="https://www.mozilla.org/zh-CN/"
title="了解 Mozilla 使命以及如何参与贡献的最佳站点。">Mozilla 主页</a>
的超链接。
</p>
结果如下(当鼠标指针悬停在链接上时,标题将作为提示信息出现)
块级链接
如上所述,你可以将一些内容转换为链接,甚至是块级元素。例如你想要将一个图像转换为链接,你只需把图像元素放到<a></a>
标签中间。
<a href="https://www.mozilla.org/zh-CN/">
<img src="mozilla-image.png" alt="链接至 Mozilla 主页的 Mozilla 标志">
</a>
文档片段
超链接除了可以链接到文档外,也可以链接到HTML文档的特定部分(被称为文档片段)。要做到这一点,你必须首先给要链接到的元素分配一个id
属性。例如,如果你想链接到一个特定的标题,可以这样做:
<h2 id="Mailing_address">邮寄地址</h2>
然后链接到那个特定的id
,您可以在URL的结尾使用一个井号指向它,例如:
<p>要提供意见和建议,请将信件邮寄至 <a href="contacts.html#Mailing_address">我们的地址</a>。</p>
你甚至可以在同一份文档下,通过链接文档片段,来链接到同一份文档的另一部分:
<p>本页面底部可以找到 <a href="#Mailing_address">公司邮寄地址</a>。</p>
电子邮件链接
当点击一个链接或按钮时,打开一个新的电子邮件发送信息而不是连接到一个资源或页面,这种情况是可能做到的。这样做是使用<a>
元素和mailto
:URL的方案。
其最基本和最常用的使用形式为一个mailto
:link (链接),链接简单说明收件人的电子邮件地址。例如:
<a href="mailto:nowhere@mozilla.org">向 nowhere 发邮件</a>
这会创建一个链接,看起来像这样: 向 nowhere 发邮件。
具体细节
除了电子邮件地址,您还可以提供其他信息。事实上,任何标准的邮件头字段可以被添加到你提供的邮件URL。 其中最常用的是主题(subject)、抄送(cc)和主体(body) (这不是一个真正的头字段,但允许您为新邮件指定一个短内容消息)。 每个字段及其值被指定为查询项。
下面是一个包含cc、bcc、主题和主体的示例:
<a href="mailto:nowhere@mozilla.org?cc=name2@rapidtables.com&bcc=name3@rapidtables.com&subject=The%20subject%20of%20the%20email&body=The%20body%20of%20the%20email">
Send mail with cc, bcc, subject and body
</a>
注意: 每个字段的值必须是URL编码的。 也就是说,不能有非打印字符(不可见字符比如制表符、换行符、分页符)和空格 percent-escaped. 同时注意使用问号(?
)来分隔主URL与参数值,以及使用&符来分隔mailto:
中的各个参数。 这是标准的URL查询标记方法。阅读 GET 方法 以了解哪种URL查询标记方法是更常用的。