<article>标签用于包裹可独立存在、可转载、可单独理解的内容单元，必须包含标题、作者、时间等完整语义信息，多篇文章应各自用<article>包裹，不可混包，嵌套需符合逻辑衍生关系。
用 <article> 标签包裹独立文章，核心是确保它表达“可独立存在、可被转载、可单独理解”的内容单元。
<article> 必须包含完整语义信息
它不只是包正文，而是包裹整篇内容的最小独立单元：标题、作者、时间、正文、甚至评论（若作为该文的一部分）。
例如一篇博客文章，应这样组织：
<article>
<header>
<h1>HTML5语义化标签怎么用</h1>
<p>作者：<a href="/author/jane">Jane</a></p>
<time datetime="2026-07-20">2026年7月20日</time>
</header>
<p>语义化不是加标签，而是让标签说对话……</p>
<p>……正文继续。</p>
<footer>
<p>本文首发于个人博客，转载请注明作者与出处。</p>
</footer>
</article>多篇文章并列时，每篇一个 <article>
首页或列表页中，不要用一个 <article> 包所有文章，而应为每篇单独使用：
- ✅ 正确：
<main><article>…</article><article>…</article></main> - ❌ 错误：
<main><article><h2>文章1</h2>…<h2>文章2</h2>…</article></main>
嵌套规则要清晰<article> 可以嵌套（如评论区每条评论也是独立内容），但子 <article> 必须逻辑上属于父文的衍生内容，比如：
- 博客正文
<article>内，用户留言也可用<article>，表示每条留言本身具备完整语义 - 不要为了布局或样式随意套
<article>，没标题、没作者、没时间、不能单独转发的内容，就不适合用
配合 <main> 和 <section> 使用更规范
- 整个页面主体内容用
<main>包裹 -
<main>内多个<article>并列，代表多个独立内容 - 若这些文章有统一主题（如“前端入门系列”），可用
<section>套一层，并加<h2>标题说明主题
不复杂但容易忽略。
立即学习“前端免费学习笔记（深入）”；
