HTML宝典(第 1 版)
2.1.5 article元素
阅读(

HTML基础

HTML元素

结构语义元素

main元素

nav元素

header元素

h1~h6元素

article元素

article元素代表文档、页面、应用程序、或网站中一个独立的、完整的、可以独自被外部引用的内容,它可以是一篇论坛帖子、一篇文章、一篇新闻报道、一篇博客文章等任何独立的内容块,它通常有自己的标题、页脚等。因此,article元素里面可包含独立的 header、footer 等结构化元素。如:

<article>
  <header>
     <h1>The Very First Rule of Life</h1>
     <p><time datetime="2016-8-8">3 days ago</time></p>
  </header>
<p>If there's a microphone anywhere ...</p>
<p>...</p>
<footer>
   <a itemprop="discussionUrl" href="?comments=1">Show comments...</a>
</footer>
</article>

 

上述代码通过一个article元素,定义了一篇完整的文章,文章由三部分组成,分别是头部、正文和尾部。头部和尾部则通过独立的 header、footer 结构化元素来定义,使文章的结构非常清晰。

一个页面可以有多个 article元素(也可以没有),如博客的主页通常包括多篇文章,每篇文章就可以是一个 article元素。并且,可以将一个 article元素嵌套在另一个 article元素中,主要内层的 article元素与外层 article元素是部分与整体的关系。在 article元素元素中包含独立的 h1~h6 标题,也是很好的做法。

关于作者

歪脖先生,十五年以上软件开发经验,酷爱Web开发,精通 HTML、CSS、JavaScript、jQuery、JSON、Python、Less、Bootstrap等,著有《HTML宝典》、《揭秘CSS》、《Less简明教程》、《JSON教程》、《Bootstrap2用户指南》、《Bootstrap3实用教程》,并全部在 GitHub 上开源。

如果本教程对您帮助很大,请随意打赏。您的支持,将鼓励我写出更好的教程!

← 键盘方向键翻页 →
返回顶部 手机访问 关注微信 返回底部

扫码访问歪脖网

随时随地,想看就看

关注歪脖网微信

分享 web 知识、交流 web 经验