HTML锚点的用法（附带实例）

所谓 HTML 中的锚点，是指在 URL 地址中出现的片段标识符，也称为页面内链接。如果所请求的目标是一个大目标，那么可以使用 <a> 链接来将页面划分成大目标的一个一个小目标，之后在地址栏中输入这个小目标的标识之后跳转到小目标的位置。

<a> 标签的 id 属性可以在页面中划分一个一个小目标，其属性的值可以是自定义的字母、数字，但是尽量不要使用数字开头来创建。

例如：

<a id="test1">测试一</a>
测试内容<br/>
测试内容<br/>
测试内容<br/>
......
测试内容<br/>
......
测试内容<br/>
测试内容<br/>
测试内容<br/>
<a id="test2">测试二</a>
测试内容<br/>
测试内容<br/>
测试内容<br/>
......
测试内容<br/>
......
测试内容<br/>
测试内容<br/>
测试内容<br/>

在上面代码的基础上，直接在浏览器地址栏的地址后面加上“＃test1”或“＃test2”将跳转至其对应的页面标记的小目标位置。

如下图所示，地址后面添加“＃test2”的效果：


以上做法虽然可以跳转到小目标位置，但是每次都需要在地址栏上输入，比较麻烦，因此可以定义跳转到这个小目标的超链接。示例代码如下，在上面代码的顶端加上 <a> 标签来进行测试。

<a href="#test1">跳转到测试一的位置</a>
<a href="#test2">跳转到测试二的位置</a><br/>

上面代码中使用相对路径，只是写了“＃test1”和“＃test2”，那么路径将会解析为当前的文件地址。锚点也可以链接到其他目标的小目标，示例代码如下：

<a href="./index.html#test1">跳转到 index.html 测试一的位置</a>
<a href="./index.html#test2">跳转到 index.html 测试二的位置</a>

上述代码中，单击任何一个链接将直接跳转到 index.html 的小目标位置。