此页面由社区从英文翻译而来。了解更多并加入 MDN Web Docs 社区。
<article>:文章内容元素
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.
<article>HTML 元素表示文档、页面、应用或网站中具有独立分发或复用意义的自包含内容块,例如论坛帖子、杂志或报纸文章、博客条目、产品卡片、用户评论、交互式组件等独立内容项。
In this article
尝试一下
<article> <h1>西雅图天气预报</h1> <article> <h2>2018 年 3 月 3 日</h2> <p>雨。</p> </article> <article> <h2>2018 年 3 月 04 日</h2> <p>降雨时段。</p> </article> <article> <h2>2018 年 3 月 05 日</h2> <p>大雨。</p> </article></article>.forecast { margin: 0; padding: 0.3rem; background-color: #eee;}.forecast > h1,.day-forecast { margin: 0.5rem; padding: 0.3rem; font-size: 1.2rem;}.day-forecast { background: right/contain content-box border-box no-repeat url("/shared-assets/images/examples/rain.svg") white;}.day-forecast > h2,.day-forecast > p { margin: 0.2rem; font-size: 1rem;}一个文档中可以包含多个文章;例如,在一个博客页面中,用户滚动时依次展示的每篇文章都可以用一个<article> 表示,且其中可能包含一个或多个<section>。
属性
这个元素只包含全局属性。
使用说明
示例
html
<article> <h2>侏罗纪公园</h2> <section> <h3>评论</h3> <p>恐龙是伟大的!</p> </section> <section> <h3>用户评论</h3> <article> <h4>太吓人了!</h4> <p>对我来说太可怕了。</p> <footer> <p> 发表于 <time datetime="2015-05-16 19:00">5 月 16 日</time> 作者:Lisa。 </p> </footer> </article> <article> <h4>我喜欢恐龙!</h4> <p>我同意,恐龙是我的最爱。</p> <footer> <p> 发表于 <time datetime="2015-05-17 19:00">5 月 17 日</time> 作者:Tom。 </p> </footer> </article> </section> <footer> <p> 发表于 <time datetime="2015-05-15 19:00">5 月 15 日</time> 作者:Staff。 </p> </footer></article>结果
技术概要
规范
| Specification |
|---|
| HTML> # the-article-element> |