main,article,section标记 - TsingYiPontifex/html5 GitHub Wiki
- main（主要内容）
- article（文章内容）
- section（文章内容区块）
main标记描述文章的主要内容，是HTML5新增加的标记。 主要内容可以理解为每个页面的独有内容，比如说新闻网页的新闻内容，仅仅这个页面才有的内容。 而页头，页脚，菜单栏等部分则不属于页面的主要内容。
<body>
<main role="main">
<article>
<h1>这是页面的正文标题</h1>
<p>在这里我会写页面的正文内容，可以分几个自然段，开头别忘了空2个空格。</p>
<p>在这里我会写页面的正文内容，可以分几个自然段，开头别忘了空2个空格。</p>
<p>在这里我会写页面的正文内容，可以分几个自然段，开头别忘了空2个空格。</p>
</article>
</main>
</body>article标记表示网页内独立内容的区域（section），比如新闻正文内容，博客正文内容等等。
<article>
<header>这是文章的头部，可以写上文章的标题，发表时间等等</header>
<p>这是文章的正文部分，自然段1...</p>
<p>这是文章的正文部分，自然段2...</p>
<p>这是文章的正文部分，自然段3...</p>
<footer>这是文章的脚部，可以写上作者信息，文章出处等等</footer>
</article>section表示文章中的段落部分，可以生成页面的轮廓（outline），可以根据页面内容的情况把内容 逻辑分为几个具有层次感的区域，也是SEO工作的一部分，尽量使得搜索引擎的机器人更容易理解网页的结构和内容。
<article>
<header>
<section>
<h1>这里是文章的大标题</h1>
</section>
</header>
<section>
<h2>这里是文章的小标题1</h2>
<p>这里是小标题1的内容区</p>
<p>这里是小标题1的内容区</p>
<p>这里是小标题1的内容区</p>
</section>
<section>
<h2>这里是文章的小标题2</h2>
<p>这里是小标题2的内容区</p>
<p>这里是小标题2的内容区</p>
<p>这里是小标题2的内容区</p>
</section>
<section>
<h2>这里是文章的小标题3</h2>
<p>这里是小标题3的内容区</p>
<p>这里是小标题3的内容区</p>
<p>这里是小标题3的内容区</p>
</section>
</article>备注
section标记的第一个子标记一定要用h1-h6的小标题。