在制作网页时,我们常常遇到需要添加侧边导航,通过点击导航让页面自动滚动到指定位置,如:电商网站的楼层。这就涉及到<a>标签的锚点应用,把它称为“锚点标签”。
一、锚点
我们想要让页面跳转到的位置,就是锚点。锚点是一种超链接,只不过它是页面内部的超链接,它指向页面特定的部分。
二、锚点标签运用
要使用锚点定位,需要两个部分组成:1、锚记; 2、指向锚记的链接
有以下方法:
方法一:只能使用a标签作为锚记和链接,网上俗称使用“name”定位,代码如下:
-
<a href="#mao" target="_blank">点击此处到目标位置</a> <p></p> <a name="mao" target="_blank">目标位置</a>
但是很多时候锚点对象不一定是a标签,那就不必要为了使用锚点定位而额外增加一个a标签了
方法二:使用a标签作为链接,使用其他元素(建议使用块元素)作为锚记,网上俗称“id”定位,代码如下:
<a href="#mubiao" name="mubiao" target="_blank">点击此处到目标位置</a> <div name="mubiao"> 目标位置 </div>
甚至可以从一个页面链接到另一个页面的锚记位置,代码如下:
页面1
-
<a href="http://maodian2.html#other_page" target="_blank">另一个页面传送门</a>
页面2