网页锚点添加偏移

由于博客有一个顶部浮动菜单,这样点击锚点链接之后,菜单会遮住一部分锚点后的内容。为了解决这个问题需要让点击锚点后的位置有个偏移。可以使用 CSS 实现。

1
2
3
4
5
6
7
8
.headerlink:before {
content: "";
display: block;
visibility: hidden;
position: relative;
height: 80px;
margin-top: -80px;
}

References

offsetting an html anchor to adjust for fixed header

Mastodon