<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 表格仅在浏览器中加载

另请参阅