• 目标元素需要唯一 id
• href="#main" 不会打开新页面
• 地址栏通常会出现片段标识

<header id="top">
  <h1>Web前端技术</h1>
  <a href="#main">跳到主要内容</a>
</header>

<section>
  <h2>课程介绍</h2>
  <p>本课程学习如何制作浏览器中可以访问和操作的网页。</p>
  <p>HTML 描述内容的结构与语义，例如标题、段落、图片和链接。</p>
  <p>CSS 设置颜色、字体和布局，让内容更清晰、更易阅读。</p>
  <p>JavaScript 处理交互，例如点击按钮后更新页面内容。</p>
</section>

<section>
  <h2>学习方法</h2>
  <ol>
    <li>先阅读示例，预测浏览器会展示什么。</li>
    <li>每次修改一个地方，对照修改前后的结果。</li>
    <li>遇到问题时，检查标签、属性和文件路径。</li>
    <li>查阅文档，理解示例为什么这样写。</li>
    <li>使用大模型辅助解释和修改代码，再检查实际效果。</li>
  </ol>
  <p>学习的目标不仅是让网页运行起来，还要能够解释和修改自己的代码。</p>
</section>

<main id="main">
  <h2>主要内容：页内锚点</h2>
  <p>你已到达 id 为 main 的位置，仍在同一页面中。</p>
  <a href="#top">返回顶部</a>
</main>