div 、section 、article的区别和使用场景

主要区别，以及适用场合如下：
1、div在html早期版本就支持了，section和article是html5提出的两个雨衣话标签。如果只是针对一个块内容做样式化，三者并没有区别。
2、作为语义化标签，section应用的典型场景有文章的章节、标签对话框中的标签页、或者论文中有编号的部分。一般来说，当元素内容明确地出现在文档大纲中时，section就是适用的。
3、对于article标签来说，无论从结构上还是内容上来说，article本身就是独立的、完整的。最简单的方法就是看一段内容脱离了所在的语境之后，是否还是完整的、独立的，如果是，则应该用article标签。
4、div、section、article，语义上从无到有，逐渐增强。div无任何语义，仅仅用作样式化或者脚本化，对于一段主题性的内容，比较适用section，而假设这段内容是可以脱离上下文，作为完整的结构体独立存在的一段内容，那么就适合用article。原则上来说，能使用article的时候，也是可以使用section的。但是视情况而定，假如更适合使用article，那么就不要使用section了。

什么时候使用？
1、div：作为布局以及样式化时使用。

2、section：表示文档中的节，一般是具有标题的。比如：文档大纲、文档章节、博客条目、用户评论部分或者论文中有编号的部分时使用；
通常会带有标题。如果没有标题，那么就不推荐使用section
    <section>
            <h2>文章章节标题</h2>
            <p>文章章节段落内容</p>
        </section>

3、article：表示独立的自包含内容，如：一篇文章。文章找那个可以包含标题、内容、脚注
    <article>
            <header>
                <h1>文章标题</h1>
                <p>写作时间 作者信息</p>
            </header>
            <section>
                <p>文章正文</p>
            </section>
            <footer>
                <p>注脚：法律信息神马的</p>
            </footer>
        </article>

标注：
a、<header>：定义文档的页面介绍信息，比如：文章标题、发表时间
b、article和section可以互相嵌套使用