div标签HTML规范:“div元素没有任何特殊意义。”这个标签是我们看到和使用最多的标签。本身没有语义,用作布局和样式或脚本的挂钩。Section标签HTML规范:“section元素表示文档或应用程序的通用部分。在这种情况下,一个部分是内容的主题分组,通常带有标题。”相对于div的非语义化,简单的说section是一个有语义化的div,但是不要以为真的那么简单。section表示一段主题内容,通常带有标题。看到这里,我们可能会想,那么一篇博文或者一条评论就可以只用section吗?“当联合元素的内容有意义时,鼓励作者使用article元素而不是section元素。”当聚合时元素的内容更有意义时,应使用文章而不是部分。什么时候应该使用节?section应用程序的典型场景是文章的章节、选项卡对话框中的选项卡页或论文中的编号部分。一个网站的首页可以分为介绍、新闻、联系方式等几个部分。section不仅仅是一个普通的容器标签。当标签仅用于样式或脚本方便时,应使用div。通常,当元素内容明确出现在文档大纲中时,节是合适的。示例:苹果
美味可口的水果!
苹果是苹果树的仁质果实。
RedDelicious
这些鲜红的苹果是许多超市中最常见的。
GrannySmith
这些多汁的青苹果是苹果派的绝佳馅料。
文章标签HTML规范:“article元素表示文档、页面、应用程序或网站,原则上可以独立分发或重复使用,例如在联合组织中。”article是一个特殊的section标签,比sectionSemantic有更具体的定义,表示相关内容的自包含完整块.通常,一篇文章会有一个标题部分(通常包含在标题中),有时还有一个页脚。section虽然也是一个专题内容,但是文章本身在结构和内容上都是独立完整的。示例:如果您附近有麦克风,假设它很热并且正在向全世界发送您所说的任何内容。说真的。
...
如果您附近有麦克风,请假设它很热并且正在向全世界发送您所说的一切。说真的。
...
嘿,你的名字和我一样。
总结:divsectionarticle,语义从无到有,逐渐增强的div没有语义,只是作为一个styledorscriptedhook(钩子),对于一个topic的内容,section是适用的,如果这块内容可以分离从上下文来看,作为一个完整而独立的内容存在,则该文章是适用的。原则上可以用article的时候也可以用section,但实际上如果用article更合适,那就不要用section。nav和aside的使用也是如此。这两个标签也是特殊的部分。当使用nav和aside更合适时,不要使用section。区分div和section、article等标签比较简单。section和article乍一看很难区分。其实关键是看这一段内容在没有整体的情况下,是否还能作为一个完整独立的内容存在。这里的重点是完整性。因为其实section所包含的内容也可以看作是一个独立的片段,但是只能看作是整体的一部分,文章才是一个完整的整体。