html - 将页外 div 部分与添加的填充链接起来

Question

因此，如果这个问题之前已经得到回答，我提前道歉 - 我尝试搜索但找不到太多内容。

我和一位设计师正在努力创建这个网站 - www.zeinal-jundi.com

这主要是单页布局，使用滚动效果导航到不同的部分，尽管该网站的唱片目录部分确实链接到每个专辑的单独页面。我们还有一个固定的标题，允许导航始终可见。最初，我为页面的每个部分添加了边距以适应固定标题的高度。然而，这使得每个部分之间的空间太大，所以我的设计师要求我找到解决这个问题的方法。我能够通过向滚动动画脚本添加一个值来修复它，该脚本使该部分从顶部开始大约 250 像素，而不是到页面的整个顶部(然后它会被固定标题覆盖)

所以现在，我当然遇到了从另一个页面链接到这些部分的问题 - 使用如下代码:

<a href="http://zeinal-jundi.com/#bio">Biography</a>

这当然会链接回首页，但会将该部分带到最顶部，它被我们的标题隐藏了。我想知道是否有人知道我可以从另一个页面链接到此部分的方法，但添加一个类似于我在滚动功能上的操作，它将使它从页面顶部向下移动 250 像素，而不是非常顶级， 我不必为每个 div 添加边距。

另一个选择当然是让讨厌的固定标题更短，或者可能在页面滚动到某个点后隐藏网站标题，但我们的客户似乎非常坚持让整个标题始终可见，所以我当然，我正在努力寻找解决方法，这样我们就不必重新考虑整个元素(如果存在这样的解决方案的话)。

我希望我解释得足够好!如果您需要查看任何其他代码，请告诉我 - 很想听听您对如何实现这样的事情的想法! :)

Answer 1

如果您通过 CSS 放置 block ，则可以使用 CSS3 :target pseudo selector定位链接指向的任何部分，例如:

:target {
    /* ... example:
     top: 250px;
     */
}