制作锚点链接

锚点链接有什么作用呢?当一个页面过长,拖动起来非常的费劲,于是在本页面建立锚点链接,在本页面进行链接。

1、先举个例子,说下下锚点链接的概念。

如图所示,比如,如图所示是一个网页。

锚点链接的意思说就是:“abc”就是一个链接,我点击“abc”之后,就会跳转到"123"的位置上。

最常用的方式,在一个网页的开头,做一个目录,每一个目录都是一个锚点链接,然后链接到本页面相关的位置。

 

2、锚点链接的语法:<a name="锚点的名字"></a>,意思是在网页中的某一个位置,插入一个锚点<a href="#锚点的名字">显示的字样</a>

意思是在网页中的某一个位置链接之前设定的锚点,只要点击该链接,就会自动跳转到锚点处。

 

3、在body中增加一行:<a name="ch"></a>hello,我在这里,来找我啊,意思是创建一个锚点,锚点的名字为“ch”

 

4、看下网页的效果图:

 

5、接着,在body中,再增加一行代码:<a href="#ch">我来找你啦</a>,完整代码如图:

 

6、看网页效果图,当点击网页上面的链接后,就会跳转到下面的那行字。

 

 

7、最后,给一个完整的例子,代码如下:

 

8、网页效果如下:

 

9、点击“第一章”后,自动跳转到“第一章”所在的锚点

 

10、“第二章”和“第三章”的效果同上。

posted @   岁月淡忘了谁  阅读(1277)  评论(0编辑  收藏  举报
(评论功能已被禁用)
编辑推荐:
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
阅读排行:
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
历史上的今天:
2015-05-25 文件上传和下载
2015-05-25 java实现文件转换成二进制存储与取出
点击右上角即可分享
微信分享提示