javascript - 锚定到 div 以转到 div 上方的某个点以允许固定标题

Question

我的网站上有一个固定的标题，并试图锚定到页面上的不同部分。

页面将滚动到锚定 div 距屏幕顶部 0px 的位置，但是，使用固定标题这意味着锚定 div 的一半现在隐藏在其后面。

看这个例子：

#fixed{
  position:fixed;
  top:0px;
  background-color:#333;
}
div{
  width:100%;
  height:150px;
  border:1px solid #333;
}
nav{
  margin-top:150px;
}

<div id="fixed"></div>
<nav>
<a href="#1">1</a>
<a href="#2">2</a>
<a href="#3">3</a>
<a href="#4">4</a>
<a href="#5">5</a>
</nav>
<div id="1">1</div>
<div id="2">2</div>
<div id="3">3</div>
<div id="4">4</div>
<div id="5">5</div>

我想知道的是，是否有一种方法可以锚定到我想去的 div 上方的像素点，这样当您单击链接时，它会滚动到该 div 位于固定标题下方的点？

Answer 1

编辑：给每个 div 一个类，然后将以下 css 添加到这个类：

.classname {
   padding-top: 150px;
   margin-top: -150px;
}