header和footer是语义标签，用于标识内容区块的开头或结尾，不可滥用为视觉装饰；一个页面可有多个，但须依附于section、article等语义容器且不能嵌套；全局footer通常位于body末尾，但各语义区块也可自有footer；它们不提供默认样式，需CSS控制，语义正确优先。

和

不是用来“套样式”或“撑高度”的，它们是告诉浏览器、搜索引擎和读屏软件：“这部分内容在语义上属于某个区块的开头或结尾”。用错位置，结构就乱了，SEO 和无障碍访问都会打折。

一个页面能有几个

？

可以有多个，但必须依附于语义容器——比如 、

、

或

。不能孤立存在，也不能嵌套在另一个

或

里。

• 下的
  ：适合放网站 logo、主导航、全局搜索框
• 内的
  ：放该文章的
  、作者、发布时间等
• 内的
  ：放这一节的小标题、副标题或说明性文字
• 别把 banner 图片、装饰性横线硬塞进
  ——它不是视觉标签，没内容语义就别用

必须放在页面最底下吗？

不一定。全局

应作为 的直接子元素，通常位于页面末尾；但每个

、

甚至

都可以有自己的

，用来放该区块的版权、数据来源、编辑时间、相关链接等。

• >
  ：放全站版权、隐私政策、备案号
• >
  ：放“本文更新于 2026-05-06”“数据来自 XX 公开 API”
• 别在
  里放
  ，也别让
  包裹导航栏——它们彼此无隶属关系
• 纯装饰性分隔线、背景色块，用
  更准确

  和

  /

  能嵌套吗？

  不能。

  必须是 的直接子元素，且只能出现一次；它也不能被

  、

  、

  或

  包裹。

  • 错误写法：
    ...
    （
    被语义化头部包裹）
  • 正确顺序：通常是
    →
    →
    →
    ，全部并列在 下
  • 内部可以有
    、
    ，这些内部再各自用
    /
  • 滥用嵌套会让屏幕阅读器误判主内容位置，也影响搜索引擎对核心内容的提取

  最容易被忽略的一点：语义标签不提供默认样式，也不自动触发布局行为。你得自己写 CSS 控制显示，但千万别为了“看起来像 header”就硬套

  ——语义错了，再好看的样式也是空中楼阁。