<footer>:頁尾元素

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

<footer> HTML 元素表示其最近的章節型內容章節根元素的頁尾。<footer> 通常包含有關該章節作者的信息、版權數據或與相關文檔的鏈接。

嘗試一下

屬性

此元素僅包含全域屬性

使用注意事項

  • 將有關作者的信息置於可以包含在 <footer> 元素中的 <address> 元素中。
  • 當最近的祖先章節型內容或章節根元素是 body 元素時,頁尾應用於整個頁面。
  • <footer> 元素不是章節型,因此在大綱中不引入新的節。

範例

html
<body>
  <h3>FIFA World Cup top goalscorers</h3>
  <ol>
    <li>Miroslav Klose, 16</li>
    <li>Ronaldo Nazário, 15</li>
    <li>Gerd Müller, 14</li>
  </ol>

  <footer>
    <small>
      Copyright © 2023 Football History Archives. All Rights Reserved.
    </small>
  </footer>
</body>
css
footer {
  text-align: center;
  padding: 5px;
  background-color: #abbaba;
  color: #000;
}

無障礙議題

在 Safari 13 之前的版本中,contentinfo 標誌角色未能被 VoiceOver 正確顯示。如果需要支持舊版 Safari 瀏覽器,請在 footer 元素中添加 role="contentinfo",以確保該標誌能夠被正確顯示。

技術摘要

內容類型 流內容、捫及內容。
允許的內容 流內容,但不得包含 <footer><header> 的後代元素。
標籤省略 不允許,開始和結束標籤都是必須的。
允許的父元素 任何接受 流內容 的元素。請注意,<footer> 元素不得是 <address><header> 或另一個 <footer> 元素的後代。
隱含 ARIA 角色 contentinfo,或者如果是 articleasidemainnavsection 元素的後代,或具有 role=articlecomplementarymainnavigationregion 的元素,則隱含為 generic
允許的 ARIA 角色 grouppresentationnone
DOM 介面 HTMLElement

規範

Specification
HTML Standard
# the-footer-element

瀏覽器相容性

BCD tables only load in the browser

參見