什么是HTML锚点，锚点应该如何用？【百科全说】

对于网页制作初学者来说锚点应当是个很新鲜的词，但是在我们浏览网页的时候确实经常可以见到的。现在就给大家介绍一下锚点以及如何使用锚点吧。

定义：锚点

01

在W3C标准字“Anchor”一词即为锚点，其解释为：资源中的某个区域可以是零个、一个或多个链接的目标或源。锚点可以引用整个资源，或者的特定部分，或者资源的特定表现形式。通俗的理解：锚点是一种超链接，只是它是页面内部的超链接。
02

比如我们有一个网页很长很长，而且里面的内容，可以分为N个部分。这样的话，我们就可以在网页的顶部设置一些锚点，这样便可以方便浏览者点击相应的锚点，到达本页内相应的位置，而不必在一个很长的网页里自行寻找。

锚点的用法

01

锚点的用法有两种，但性质同样，都是通过链接标签<a></a>以及其href属性实现的：一种是：页内跳转；一种是：跳到其他页面的某个区域。下面我们看具体的操作。我做了一个示例，代码如下：
02

1）现在我们来看也内跳转的锚点用法：我给每个每个div添加了ID号，然后将每个链接标签的href属性分别按顺序与每个div的ID相对应。【注意：href属性后的ID号必须有“#”，否则无效。】
03

在浏览器预览下，点击第四个，就跳到下面的第四个div了
04

2）现在我们来看页外跳转的锚点用法：加入我在一个名为“示例”的文件夹中见了两个HTML文档第一个名为index.html 第二个名为index2.html 里面的代码都一样，跟我贴出的“锚点的用法”这一步骤中的第二个步骤所贴出的图片一样。现在我把index.html当中第一个a标签把其中的href="#1"，更改为href=“index.html/#1”并保存之后，我们再在浏览器打开，这时候会发现，页面会跳转到index2.html中的ID=1的div所在的区域。没错这就是页外的锚点跳转。所以当我们需要跳转到其他页面的某个区域时，只要把href的属性值设置“跳转页面的URL+所想跳转到区域的ID（或者说锚点名称）”即可。
05

这里我需要说明，我的示例均使用的ID锚点，给div添加ID的时候就为该div设置了锚点。早前的html版本规范是支持name属性的，即个元素添加name属性，比如name="anchor1"，然后通过a标签来实现锚点跳转。这种方法我不建议使用。因为在最新版本的规范中或者说是严格的版本中通过name属性来实现锚点的跳转这种方式已经不被支持了。所以推荐使用ID属性。

什么是HTML锚点，锚点应该如何用？

定义：锚点

锚点的用法

相关推荐