<article>

HTML <article>元素表示文档、页面、应用或网站中的独立结构，其意在成为可独立分配的或可复用的结构，如在发布中，它可能是论坛帖子、杂志或新闻文章、博客、用户提交的评论、交互式组件，或者其他独立的内容项目。​​

给定文档中可以包含多篇文章;例如，阅读器在博客上滚动时一个接一个地显示每篇文章的文本，每个帖子将包含在<article>元素中，可能包含一个或多个<section>。

内容分类 Flow content, sectioning content, palpable content.
允许的内容 Flow content.
标记省略 不允许，开始标签和结束标签都不能省略。
允许的父元素 所有接受 Flow content的元素。注意<article>元素不能成为<address>元素的子元素。
允许的 ARIA roles application, document, feed, main, presentation, region
DOM 实例 HTMLElement

属性

此元素只具有全局属性。

使用说明

  • 每个<article>，通常包括标题（<h1> - <h6>元素）作为<article>元素的子元素。
  • 当<article>元素嵌套使用时，则该元素代表与外层元素有关的文章。例如，代表博客评论的<article>元素可嵌套在代表博客文章的<article>元素中。
  • <article>元素的作者信息可通过<address>元素提供，但是不适用于嵌套的<article>元素。

  • <article>元素的发布日期和时间可通过<time>元素的pubdate属性表示。

  • 可以使用<time> 元素的datetime属性来描述<article>元素的发布日期和时间。请注意<time>的pubdate 属性不再是W3C HTML5标准。

示例

<article class="film_review">
  <header>
    <h2>Jurassic Park</h2>
  </header>
  <section class="main_review">
    <p>Dinos were great!</p>
  </section>
  <section class="user_reviews">
    <article class="user_review">
      <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">
      <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>

规范

规范 状态 注释
HTML Living Standard
<article>		 Living Standard
HTML5
<article>		 Recommendation

浏览器兼容

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
articleChrome Full support 5Edge Full support 12Firefox Full support 4IE Full support 9Opera Full support 11.1Safari Full support 5WebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support 11.1Safari iOS Full support 4.2Samsung Internet Android Full support Yes

Legend

Full support  
Full support

相关文章