HTML5 div section article的区别

1.div: 作为布局以及样式化时使用；本身无任何语义

2.section：表示文档中的节,一般是具有标题的。

如：文档大纲、文章章节、博客条目、用户评论部分或者论文中有编号的部分时使用；

3.article：表示独立的自包含内容，代表一个独立的、完整的相关内容块。

如：一篇文章。文章中可包含标题、内容、脚注。

 

主题性的内容，适用section

完整的独立存在的一段内容，则就适用 article

能使用article的时候，也是可以使用section的，但是实际上，假如使用article更合适，那么就不要使用section。

 

注:section元素的使用禁忌

• 不要将section元素用作设置样式的页面容器，那是div元素的工作；
• 如果article元素、aside元素或nav元素更符合使用条件，不要使用section元素；
• 不要为没有标题的内容区块使用section元素(section使用必须有标题！)。

例：

<article>
　　<header>
　　<h1>文章标题</h1>
　　</header>
　　<p>文章内容</p>
　　</article>

　　2、示例

　　<article>
　　　　　<header>
　　　　　　　　　<h1>文章标题</h1>
　　　　　　　　　<p><time datetime="2014-03-28">发表时间</time></p>
　　　　　</header>
　　　　　<p>文章正文</p>
　　　　　<section>
　　　　　　　　　<h2>文章评论</h2>
　　　　　　　　　<article>
　　　　　　　　　　　　　<header>
　　　　　　　　　　　　　　　　　<h3>发表者：lanyf</h3>
　　　　　　　　　　　　　　　　　<p><time datetime="2014-03-28">10:13</time></p>
　　　　　　　　　　　　　</header>
　　　　　　　　　　　　　<p>评论内容</p>
　　　　　　　　　</article>
　　　　　</section>
　　</article>

(1)评论是文章的一个节，所以使用section。
(2）而每一个用户的评论是相对独立的内容，所以每一个用户的评论用article。