html - 为 HTML-Anchor 创建偏移量

Question

我有一个列出一些教程/演示文稿的网站（很长，所以你需要滚动）。为了方便起见，我决定在页面顶部创建一个菜单，用户可以单击它并跳转到正确的位置（在同一页面上）。菜单代码：

<ul>
<li><a href="#tutorial1">Tutorial 1</a></li>
...
</>

所以现在在网站上，我有几个隐藏的锚点，如下所示：

<p><a name="tutorial1" ></a></p>

这个想法是，用户点击链接并跳转到网站上的正确位置。

但是有一个问题：该站点的模板顶部有一个菜单，该菜单始终可见（滚动时也是如此）。所以发生的事情是，当我点击一个菜单项时，这个菜单会覆盖正确的位置。所以我真正想要的是在点击后站点跳转到 achnor 减去偏移量，这是由这个菜单创建的。

所以我想知道，是否可以通过向我的锚添加一些 CSS 来实现这一点，如下所示：

<p><a name="tutorial1" style="positioning:relative; top:-60px" ></a></p>

我没有看到任何效果。我究竟做错了什么？

标签： htmlcssanchor

Answer 1

确保在每个 CSS 属性的末尾添加一个分号，除了最后一个。

<p><a name="tutorial1" style="positioning:relative; top:-60px" ></a></p>

您想将菜单的高度设置为现在的高度。然后将网站的其余部分放在网站容器中。这样，固定标题不会与您网站的内容重叠。