HTML页内锚点跳转失效，a href指向对应section无法正常跳转求助

问题定位 #

• id属性规则使用错误：页内锚点跳转的逻辑是，<a>标签的href属性前缀#仅作为锚点标识，用来指向id等于#后字符串的元素。你的代码中<section id="#Brief_Overview">、<h3 id="#What-is-Python?">的id值额外添加了#，导致实际元素id和href指向的id不匹配，跳转失效。
• id包含非法特殊字符：id属性值不建议包含?这类URL特殊字符，浏览器解析时可能将?识别为查询参数起始符，打断锚点匹配逻辑，会导致对应子导航跳转也失效。
• HTML语法不规范：导航内<h1>的闭合标签错写为</h2>，子列表<ul id="sub-list">直接嵌套在父级<ul>内、没有放在<li>标签中，不符合HTML语法规范，可能干扰元素解析。

修复方案 #

按以下规则修改代码即可：

1. 移除所有元素id值前的#前缀，仅保留实际标识名
2. 替换id值中的?为下划线等合法字符，同步修改对应导航链接的href属性
3. 修正标签闭合、嵌套的语法错误

修改后的完整代码如下：

<main id="main-doc">
  <div class="page-wrapper">
    <nav id="navbar">
      <header><h1>Python for Beginners</h1></header>
      <ul id="main-list">
        <li>
          <a href="#Brief_Overview" class="nav-link">Brief Overview</a>
          <ul id="sub-list">
            <li><a href="#What-is-Python" class="nav-link">What is Python?</a></li>
            <li><a href="#What-can-Python-do" class="nav-link">What can Python do?</a></li>
            <li><a href="#Why-Python" class="nav-link">Why Python?</a></li>
            <li><a href="#Python-compared-to-other-languages" class="nav-link">Python compared to other languages</a></li>
          </ul>  
        </li>
      </ul>  
    </nav>  
  </div>  
  <section id="Brief_Overview" class="main-section">
    <header><h2 class="Main-Header">Brief Overview</h2></header>
    <h3 class="Sub-Heading" id="What-is-Python">What is Python?</h3>
  </section>
  <section id="What-can-Python-do" class="main-section">
    <header><h2>What can Python do?</h2></header>
  </section>
  <section id="Why-Python" class="main-section">
    <header><h2>Why Python?</h2></header>
  </section>
  <section id="Python-compared-to-other-languages" class="main-section">
    <header><h2>Python compared to other languages</h2></header>
  </section>
</main>

内容的提问来源于stack exchange，提问作者chris10