使用锚在网页内部链接

使用锚在网页内部链接

<a>标签将网页中的一个点标记为锚(anchor)。通过使用这个点创建指向这个点的链接。这样,读者在阅读时,可以通过锚点进行内容的跳转。

锚点可以与链接文字在同一页面,也可以在不同的页面。但要实现网页内部的锚链接,都需要先建立锚点。通过建立的锚点才能对页面的内容进行引导和跳转。

【标签说明】

<A href="#锚点的名称">链接的文字</A>

说明:在该语法中,锚点的名称就是定义的锚点名,也就是name的赋值。而#则代表锚的链接地址。

【实例】

<html > <head> <title>使用锚点实现网页内链接</title> </head> <body> <p><a href="#info">个人信息</a></p> <p><a href="#hobby">兴趣爱好</a></p> <p><a href="#myweb">喜爱站点</a></p> <hr /> <p>个人信息:<a name="info"></a></p> <p>姓名: 王三; 年龄 20; </p> <p>籍贯:北京 </p> <hr> <p>兴趣爱好:<a name="hobby"></a></p> 旅游、看电影、打球、逛街 <hr> <p>喜爱站点<a name="myweb"></a></p> 搜狐、新浪、QQ </body> </html>

【运行结果】

运行代码看到3个文字链接,如

建立书签和链接的页面效果

在页面中单击其中的一个链接文字,页面将会跳转到该链接的锚点所在位置。单击“兴趣爱好”链接,跳转后的页面效果如

跳转的效果

不同锚点的链接效果

注意:一般来说,锚点链接用于同一页面上内容比较多的情况下,帮助用户快速定位所关注的内容,简单页面不需要设置锚点。

发表评论:

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

微信扫一扫

微信扫一扫

微信扫一扫,分享到朋友圈

使用锚在网页内部链接