茂名市网站建设_网站建设公司_VPS_seo优化

<section>是 HTML5 引入的语义化区块标签，用来标记文档中逻辑上独立、主题相关的内容块。简单说：看到<section>就知道“这里面是一小块完整的内容”。

核心特征（一句话版本）

• 必须有标题：每个<section>内通常要包含至少一个<h1>到<h6>标题，否则应该用<div>。
• 可嵌套：Section 里可以再套 Section，表示子章节。
• 不是<div>：<div>是通用容器，无意义；<section>有明确语义，表示“独立内容区”。

典型使用场景

<!-- ✅ 正确用法：文章章节 --><article><h1>JavaScript 入门</h1><section><h2>变量声明</h2><p>let 和 const 的区别...</p></section><section><h2>函数定义</h2><p>箭头函数与普通函数...</p></section></article><!-- ✅ 正确用法：搜索结果 --><section><h2>搜索结果</h2><ul><li>结果1</li><li>结果2</li></ul></section><!-- ❌ 错误用法：仅为样式 --><sectionclass="wrapper"><!-- 应该用 <div> --><div>内容</div></section>

与<div>的快速区分法则

一句话记忆
“有标题的独立内容块用 section，纯容器用 div。”

在 HTML 大纲（outline）算法里，每个<section>都会生成一个隐式区块，有助于 SEO 和无障碍访问。但别为了“语义”而过度使用——如果内容不够独立，还是用<div>更干净。