如何 link 将标签锚定在不同的部分

Question

这是我在 (li) 中的两种方式的代码，但都不起作用：

<ul class="submenuItems">
          <li><a href="index.html#ourpurpose">Our Purpose</a></li>
          <li><a href="#scope">Scope</a></li>

对于目标，这是代码：

<h1 id="ourpurpose">Our Purpose<h1>
...
<h1 id="scope">Scope</h1>

我想 link 它知道两者在同一个 <section> 视差页面中，但由图像和 div 分隔。

Answer 1

您需要在 link 的 href 字段中使用 ID "ourpurpose"。如果内容在同一页上。

<a href="#ourpurpose">Our Purpose</a>

Answer 2

用#scope和#ourpurpose是对的，这种情况下需要加section（也可以用div）

body, html {
    width: 100%;
    height: 100%;
    margin: 0;
}

section {
    width: 100%;
    height: 100%;
    background: red;
}

.topics {
    background: blue;
    color: white;
}

<ul class="submenuItems">
  <li><a href="#ourpurpose">Our Purpose</a></li>
  <li><a href="#scope">Scope</a></li>
</ul>

<section id="ourpurpose-section">
<h2>ourpurpose</h2>
<div class="topics" id="ourpurpose"> I am topics</div>
<p>Some Text</p>
<div class="images"><!-- Some images --></div>
</section>
<section id="scope-section">
<h2>scope</h2>
<div class="topics" id="scope">topics</div>
<p>Some Text</p>
<div class="images"><!-- Some images --></div>
</section>
<section></section>

如何 link 将标签锚定在不同的部分

how to link to anchor tag in different section

html

anchor

sections

parallax