标签

在 HTML 文档中有一个特别重要的功能，就是超级链接，浏览网页的用户可以使用 HTML 上的超链接，与网络上的另一个文档相连，你几乎可以在所有的网页中找到链接。所以今天，我们就来学习如何创建一个超链接。

我们通过使用 anchors 标签在 HTML 中创建链接。超链接可以是一个字，一个词，或者一组词，也可以是一幅图像。可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。

上面是创建一种——让当前页面跳转到别的网页的超链接

语法：[a href="跳转目标地址"]链接文字段[a/]

下面是效果图，浏览页面的用户可以点击带下划线的文字，让当前页面跳转到别的网页。

效果图

这个超链接和上一个类型的超链接只有一个属性 target="_blank" 的不同，这个属性会使得浏览页面的用户点击带下划线文字时，保留当前的页面，另外重新开启一张空白的页面/浏览器标签页，用该空白页面跳转到目标网页。

效果图

从效果图来说看不出差异，只有使用的时候会有明显的不同体验，当你的页面内容需要两个页面都保留作为互相参考和对比（比如一些资料网站），你可以悬着创建带有 target="_blank" 属性值的超链接。如果只是制作新闻类型看完即换的网页，可以悬着创建从当前页面跳转的超链接。

如我们所知，anchors的原意时船锚的意思，那么它也有船锚的作用。创建船锚就像时在创建 HTML 页面中的书签一样。这样使用者就无需不停地滚动页面来寻找他们需要的信息了。

这种书签不会以任何特殊的方式显示，它对读者时不可见的。

要完成船锚，首先要定义一个锚的名称。

定义船锚的名称

像刻舟求剑一样，呸呸呸...这是抛船锚求剑，例如上面示范的，我在 body 开头，

元素附近掉落了一支宝剑，我就在这里用抛下一个船锚——[a name="船锚的名字" /]，这样我就会记着这个地方，然后当我完成事情了，到达页面的底部了。

使用船锚

我就使用咒语——[a href="#船锚的名称"]链接文字段[/a]来启动这个船锚，然后我就可以通过点击【链接文字段】，回到我当初抛锚的地方了。（DOTA船长的X技能)

例如在项目的HomePage页面下，设置一个超链接，链接到一个介绍网页作者的页面，我们就可以这样使用——

HomePage下创建链接跳转至about me

然后我们可以点击页面中下图的链接跳转到项目的作者介绍页面（当然，你得另外准备好这个页面）

点击最下的一行超链接跳转至about me

记得 #012 课程中我们学习的项目文件夹嘛?在地址中Homepage位于项目根目录下，而建立的的about me 页面，放在了 inner-page文件夹的about分类里面，所以在 href 里要清楚的写好 about me.html 位于什么文件夹中。

项目文件夹

同样的，我们可以在 abouy me.html 制作一个返回到 HomePage 的超链接，这样就可以实现来回传送了。

about me 下创建链接跳转至 HomePage

Pro014-从零开始HTML[#014]——20分钟-Anchor 锚链接