HTML <article> 标签

本文将详细介绍 HTML <article> 标签的用法和作用。HTML <article> 标签定义独立的内容，比如论坛帖子、博客文章或者新闻报道等。

基本语法

<article>
   ...
</article>

<article> 标签可以包含各种 HTML 元素，如 <header>, <footer>, <section>, <p>, <div>, <h1>-<h6> 等。

使用场景

1. 博客文章

在构建博客网站时，每篇文章可以放置于单独的 <article> 标签中：

<article>
   <header>
      <h2>我的第一篇博客</h2>
   </header>
   <section>
      <p>这是我写的第一篇博客，记录了我的编程之旅...</p>
   </section>
   <footer>
      <p>作者：John Doe</p>
      <p>发布时间：2022-01-01</p>
   </footer>
</article>

2. 新闻报道

在构建新闻网站时，每篇新闻文章也可以放置于单独的 <article> 标签中：

<article>
   <header>
      <h2>全球疫情警报！</h2>
   </header>
   <section>
      <p>根据最新数据显示，全球已有超过 1.5 亿人感染新型冠状病毒...</p>
   </section>
   <footer>
      <p>记者：Jane Smith</p>
      <p>发布时间：2022-03-15</p>
   </footer>
</article>

注意事项

<article> 标签不能嵌套在其他 <article> 标签中。
每个 <article> 元素都应该有自己的标题，通常使用 <h1>-<h6> 标签来定义。
<article> 元素可以与其他非相关内容一起使用，如 <nav>, <aside>, <footer> 等。
<article> 标签不要用于整个网页的内容，应该用于特定的、独立的文章或者条目。

总结

HTML <article> 标签是一个非常有用的元素，它允许我们将相关的内容组织成单独的块级容器。通过正确使用 <article> 标签，我们可以提高网站的可访问性和可维护性，同时也能够更好地展示内容结构。