服务器与VPS
促销优惠信息

网站文章超链接如何定位到当前页面固定位置?

最近发现一个很有趣的建站小技巧,就是让网页内容实现超链接定位到当前页面的固定位置,也就是当前页跳转。经过了解之后发现这有一个专业名词叫“ 锚点定位”,关于锚点定位,好像实现的方式还蛮多的,我收集整理到这里,毕竟以后自己建站可能用得到。

1、a标签定位

在准备定位位置 加入锚点,<a name="a1>定位点</a>
然后加一个超链接 <a href="#a1">到定位点</a>

2、div定位

<div id="mark">定位点</div>
比如上面的html代码,在点击A链接后页面显示的位置自动跳到id="mark"的div处,实现方式如下:
<a href="#mark">到定位点</a>

3、JS定位:

<div class="button"><a href="#aaa">定位点</a></div>
跳转指定位置标签

<div class="div1" id="aaa">到定位点</div>

js部分:

<script>
window.location.hash = "#aaa"; // #aaa为锚点名称
</script>

不过对我们来说,其实只要掌握一种方法就够用了,我比较青睐第一种,毕竟它最简单。

此处为测试 锚点定位,点击文章开头的锚点定位,就会跳转到这里。

赞(2) 打赏
版权声明:本文采用知识共享 署名4.0国际许可协议 [BY-NC-SA] 进行授权

文章名称:《网站文章超链接如何定位到当前页面固定位置?》

文章链接:https://www.chukuangren.com/maodiandingwei.html

本站资源仅供个人学习交流,请于下载后24小时内删除,不允许用于商业用途,否则法律问题自行承担。