html5中div、section、article的区别

1 div

  本身没有任何语义,用作布局或样式化。    当一个标签只是为了样式化或者方便脚本使用时,应该使用 div 。

2 section

  与 div 的无语义相对,简单地说 section 就是带有语义的 div 了。

   section 不仅仅是一个普通的容器标签,section 表示一段专题性的内容,一般会带有标题。

当元素内容明确地出现在文档大纲中时,section 就是适用的。

3  article

   article 是一个特殊的 section 标签,它比 section 具有更明确的语义, 它代表一个独立的、完整的相关内容块。当元素内容聚合起来更加言之有物时,应该使用 article 来替换 section 。

   当 article 内嵌 article 时,原则上来说,内部的 article 的内容是和外层的 article 内容是相关的。例如,一篇博客文章中,包含用户提交的评论的 article 就应该嵌套在包含博客文章 article 之中。

总结:    你可以想象一份报纸,报纸分很多版,每一版都是一个section,都包含若干article,每篇文章又可以分成一个或者多个section。

    对于 section 和 article 的区分,重点就是看看这段内容脱离了整体是不是还能作为一个完整的、独立的内容而存在,这里面的重点又在完整身上。因为其实说起来 section 包含的内容也能算作独立的一块,但是它只能算是组成整体的一部分,article 才是一个完整的整体。

安博中程公开课:HTML5开发框架PhoneGap开发实战

相关推荐