html - anchor 标签位于固定导航栏后面

Question

这个 anchor 在 Firefox 中有效，但在 Chrome 中无效!我在页面顶部有一个固定的导航栏，因此前两行在它后面。 Z-Index 不是解决方案。

下面的代码是正文段落:

    <a class="resume-anchor" name="experience">
            Text Here Text Here 
    </a>

可点击链接

    <a href="resume.html#experience">Experience</a>

CSS

    .resume-anchor {
        padding-top: 40px;
    }

有人可以帮我解决这个问题吗？

Answer 1

<a href="resume.html#experience">Experience</a>链接实际上是在寻找 id #experience ，而不是名字。

要解决此问题，您的第一个 a link必须有 id experience作为:

<a class="resume-anchor" id="experience">
    <!-- Text Here Text Here --> 
</a>

此外，就良好的语法而言，作为 <a>元素指的是可点击的链接， anchor 应该直接指向您的文本 block ，例如:

<p id="experience">
    <!-- Text Here Text Here -->
</p>

希望它有意义。