html – 如何控制锚着陆位置

html – 如何控制锚着陆位置,第1张

概述我们目前遇到的问题是, www.example.com/#section表格中的链接没有跳转到正确的位置,因为我们在顶部有一个固定的导航,它覆盖了网站的第一部分. <div id="anchorpoint">Some content here</div> 我们如何告诉浏览器跳转到锚点位置100px? 谢谢. HTML(添加额外的锚标记) <a id="anchorpoint" class="anc 我们目前遇到的问题是,www.example.com/#section表格中的链接没有跳转到正确的位置,因为我们在顶部有一个固定的导航,它覆盖了网站的第一部分.
<div ID="anchorpoint">Some content here</div>

我们如何告诉浏览器跳转到锚点位置100px?

谢谢.

解决方法 HTML(添加额外的锚标记)
<a ID="anchorpoint" ></a> <div>Some content here</div>

CSS

.anchor {    display:block;    padding-top:100px;    margin-top:-100px; }

这是对Fixed position navbar obscures anchors的略微修改.优点在于,您不预先填充实际容器的填充和边距.

总结

以上是内存溢出为你收集整理的html – 如何控制着陆位置全部内容,希望文章能够帮你解决html – 如何控制锚着陆位置所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1144922.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-31
下一篇 2022-05-31

发表评论

登录后才能评论

评论列表(0条)

保存