使用锚点链接,跳转后被顶部导航遮挡部分解决办法

解决方案:

添加class,用padding调整锚点元素跳转后的位置,使用margin抵消padding对布局的影响。

padding会影响锚点元素的定位,margin不影响锚点元素的定位。

html 复制代码
 <a href="#one">1 </a>
<a href="#two"> 2</a>

<div id="one" class="question">
1
1
1
1
1
</div>
<div id="two" class="question">
2
2
2
2
2
</div>
css 复制代码
.question{
// 110px是导航栏高度 
  padding-top: 110px;
  margin-top: -110px;
}

注意:描点连接必须有滚动条,否则无效

相关推荐
莎莎小公举6 小时前
AI 应用中 Markdown 流式渲染图片闪动问题
前端
天蓝色的鱼鱼6 小时前
Next.js的水合:静默的页面“唤醒”术
前端·react.js·next.js
莎莎小公举6 小时前
AI项目中对话模块实现及markdown适配
前端
irises6 小时前
前端国际化方案结构设计
前端
brzhang6 小时前
Node 服务遇到血崩,汤过坑才知道,限流与熔断是你绕不过的坑
前端·后端·架构
Moment6 小时前
NestJS 在 2025 年:对于后端开发者仍然值得吗 ❓︎❓︎❓︎
前端·javascript·后端
Jolyne_6 小时前
一些我推荐的前端代码写法
前端
赵小川7 小时前
Taro 包升级实录 — 从 3.3 到 3.6.3 完整指南
前端·架构
_志哥_7 小时前
解除有些网站不能复制的终极办法
前端·chrome
愚昧之山绝望之谷开悟之坡7 小时前
什么是uv和传统的区别
前端·chrome·uv