HTML 链接
链接(link)就是Web上文档(或资源)的“地址”。
试一个——示例 |
HTML链接
本例演示了如何在HTML文档里创建链接。
在新窗口中打开链接
本例演示了如何在新窗口中打开链接,这样访问者就不必离开你的网站了。
(本页底部提供了更多示例)
超链接、锚和链接
按照Web的术语,超链接(hyperlink)是对Web资源的一个引用。
超链接可以指向任何Web资源:HTML页面、图像、声音文件、电影等等。
锚(anchor)是一个用于定义超链接目标的术语。
HTML锚元素<a>既用于定义超链接,也用于定义锚。
当<a>元素指向一个资源时,我们称之为HTML链接(HTML link);当<a>元素定义一个文档里的地址时,我们称之为HTML锚(HTML anchor)。
HTML链接
链接语法:
<a href="url">链接文本</a> |
起始标签里包含了跟链接有关的属性。
元素内容(“链接文本”)定义了将显示出的部分。
注意:你不但可以为文本创建链接,还可以为图像或其他HTML元素创建链接。
href属性
href属性用于定义链接的“地址”。
下面的<a>元素定义了一个指向yige.org的链接:
<a href="http://yige.org">访问yige!</a> |
上述代码在浏览器中的显示效果如下:
target属性
target属性定义了将在哪里打开链接。
以下代码将在新窗口中打开链接。
示例
试一个 » |
name属性
若<a>元素用到了name属性,那么它定义的是HTML文档里的一个具名锚(named anchor)。
具名锚在显示上不会有什么特别,网页访问者是看不见它们的。
定义具名锚:
<a name="label">任何内容</a> |
定义指向具名锚的链接:
<a href="#label">任何内容</a> |
href属性值里的“#”符号表明,链接目标是当前文档里的一个具名锚。
示例:
HTML文档里的一个具名锚:
<a name="tips">实用技巧</a> |
从相同文档链接至“实用技巧”部分:
<a href="#tips"> 跳转至“实用技巧”部分</a> |
从别的文档链接至“实用技巧”部分:
<a href="http://yige.org/html_tutorial.htm#tips"> 跳转至“实用技巧”部分</a> |
要点——实用技巧
在引用目录时,请始终以斜线结尾。像http://yige.org/html这样的地址,将导致向服务器发起两次HTTP请求。因为服务器会把斜线加上后,再向http://yige.org/html/发起一次请求。
具名锚常被用于在大型文档的开头创建“目录”:为文档中的每一章创建一个具名锚,然后把指向这些锚的链接放在文档开头。
如果当前网址里没有指定锚名,浏览器将转到文档的开头。这是正确的。
更多示例 |
图像链接
本例演示了如何为图像添加链接。
链接到同一页面里的指定位置
本例演示了如何通过链接跳转至当前文档里的其他位置。
跳出框架
本例演示了当你的网站被限定在框架里时,如何跳出框架。
创建电子邮件链接
本例演示了如何制作一个能创建电子邮件的链接(需安装有邮件客户端程序)。
创建电子邮件链接之二
本例演示了如何制作一个创建更复杂的电子邮件的链接。
链接标签
标签 | 描述 |
---|---|
<a> | 定义超链接或锚 |