当前位置: 代码迷 >> HTML/CSS >> html5中div、section、article的差异
  详细解决方案

html5中div、section、article的差异

热度:278   发布时间:2012-11-03 10:57:42.0
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开发实战