HTML 頁尾 footer：版權、聯絡資訊與結尾區塊

用來定義頁尾或文章結尾區塊，<footer> 裡面可以放入文字、logo、導覽連結、作者訊息或版權宣告...等內容。它和 <header> 是一對，同一份文件中可以重複出現，而聯絡資訊則建議搭配 <address> 一起使用。

<footer>
  <h4>F2E 前端工程文件</h4>
  <p>Copyright &copy; 2025-Present</p>
</footer>

它與 header 是一對

<footer> 與 <header> 一樣可以重複出現，代表的是某個區塊的結尾，不限定整頁最下面那一條：

<article>
  <header>
    <h2>Vue 3 computed 計算屬性</h2>
  </header>
  <p>...</p>
  <footer>
    <p>作者：Away｜標籤：Vue、效能</p>
  </footer>
</article>

聯絡資訊用 address

<footer>
  <address>
    有任何問題請來信 <a href="mailto:hello@example.com">hello@example.com</a>
  </address>
  <p>Copyright &copy; 2025-Present</p>
</footer>

<address> 代表最近的 <article> 或整份文件的聯絡資訊，別拿它來標記一般的地址文字。

小提醒

<footer> 裡不能再放另一個 <footer> 或 <header>。

常見問題

footer 只能放在頁面最下面嗎？

不是。它代表的是某個區塊的結尾，一則文章的作者資訊與標籤也可以放在該篇 <article> 自己的 <footer> 裡。

footer 裡的連結需要用 nav 包起來嗎？

零散的連結不必。若整組是完整的網站地圖或次要選單，才值得用 <nav> 包起來並以 aria-label 命名。

聯絡資訊要怎麼標記？

用 <address> 元素包住聯絡方式，它代表最近的 <article> 或整份文件的聯絡資訊。注意它是給聯絡方式用的，不是所有地址都適用。

延伸閱讀

頁首 <header>導覽 <nav>側邊欄 <aside>主要內容 <main>