锚点定位——如何设置锚点居页面顶部距离,锚点定位并距离顶部一定偏移

本文介绍了锚点在网页制作中的作用,如何创建命名锚记和链接,以及如何处理固定头部情况下锚点定位的问题。通过添加JavaScript事件监听,计算锚点距离顶部的距离减去header高度,利用window.scrollTo实现平滑滚动到目标位置,确保内容不被遮挡,此方法已验证适用于ie10+、Firefox和Chrome。
摘要由CSDN通过智能技术生成

锚点是网页制作中超级链接的一种,又叫命名锚记。命名锚记像一个迅速定位器一样是一种页面内的超级链接,运用相当普遍。

使用命名锚记可以在文档中设置标记,这些标记通常放在文档的特定主题处或顶部。然后可以创建到这些命名锚记的链接,这些链接可快速将访问者带到指定位置。

创建到命名锚记的链接的过程分为两步。首先,创建命名锚记,然后创建到该命名锚记的链接。

1.普通锚点

<a href="#aboutmao" >锚点链接</a>

...


<div id="aboutmao">锚点跳转到这里</div>

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值