<article>: 文章內容元素

基線 廣泛可用

此功能已得到充分確立,並在許多裝置和瀏覽器版本上都能正常工作。它自以下日期起在瀏覽器中可用: 2015 年 7 月.

<article> HTML 元素表示文件、頁面、應用程式或站點中一個自包含的組合,旨在獨立分發或重複使用(例如,在聯合釋出中)。示例包括:論壇帖子、雜誌或報紙文章或部落格文章、產品卡片、使用者提交的評論、互動式視窗小部件或小工具,或任何其他獨立的內容項。

試一試

給定文件中可以有多個文章;例如,在一個部落格上,當讀者滾動時,部落格會依次顯示每篇文章的文字,每個帖子都包含在一個 <article> 元素中,可能在一個或多個 <section> 內。

屬性

此元素僅包含全域性屬性

用法說明

  • 每個<article>都應該被識別,通常是透過包含一個標題(<h1> - <h6> 元素)作為<article>元素的子元素。
  • <article>元素巢狀時,內部元素表示與外部元素相關的文章。例如,部落格文章的評論可以是巢狀在表示部落格文章的<article>中的<article>元素。
  • <article>元素的作者資訊可以透過<address>元素提供,但它不適用於巢狀的<article>元素。
  • <article>元素的釋出日期和時間可以使用datetime屬性在<time>元素中描述。

示例

html
<article class="film_review">
  <h2>Jurassic Park</h2>
  <section class="main_review">
    <h3>Review</h3>
    <p>Dinos were great!</p>
  </section>
  <section class="user_reviews">
    <h3>User reviews</h3>
    <article class="user_review">
      <h4>Too scary!</h4>
      <p>Way too scary for me.</p>
      <footer>
        <p>
          Posted on
          <time datetime="2015-05-16 19:00">May 16</time>
          by Lisa.
        </p>
      </footer>
    </article>
    <article class="user_review">
      <h4>Love the dinos!</h4>
      <p>I agree, dinos are my favorite.</p>
      <footer>
        <p>
          Posted on
          <time datetime="2015-05-17 19:00">May 17</time>
          by Tom.
        </p>
      </footer>
    </article>
  </section>
  <footer>
    <p>
      Posted on
      <time datetime="2015-05-15 19:00">May 15</time>
      by Staff.
    </p>
  </footer>
</article>

結果

技術摘要

內容類別 流內容分節內容可感知內容
允許的內容 流內容.
標籤省略 無,起始標籤和結束標籤都是必須的。
允許的父元素 任何接受流內容的元素。請注意,<article>元素不能是<address>元素的後代。
隱式 ARIA 角色 article
允許的 ARIA 角色 applicationdocumentfeedmainnonepresentationregion
DOM 介面 HTMLElement

規範

規範
HTML 標準
# the-article-element

瀏覽器相容性

BCD 表格僅在瀏覽器中載入

另請參閱