H5新增一些一些标签,section和article就是其中之一。这两个标签相对于div,语义性较强。
div本身没有任何语义,用做布局,样式化,或者脚本的钩子。
section可以说是带语义的div,但不是这么简单。section表示一段专题性的内容,一般会带有标题。比如章节、页眉、页脚或文档中的其他部分。section应用的典型场景有文章的章节、标签对话框中的标签页、或者论文中有编号的部分。
而当元素内容聚合起来更加言之有物时,应该使用article来替换section。article标签定义独立的内容。可以用于论坛帖子、报纸文章、博客条目、用户评论。article比section具有更明确的语义,代表一个独立的、完整的相关内容块。一般来说,article会有标题部分,有时也会包含footer。虽然section也是带有主题性的一块内容,但是无论从结构上还是内容上,article本身就是独立的、完整的。
当article内嵌article时,原则上来说,内部的article的内容是和外层的article内容是相关的。看这段内容脱离了现在的语境,是否还是完整的、独立的。
div section article,语义是从无到有,逐渐增强的。div没有任何语义,仅仅用做样式化或者脚本化的钩子。
对一段主题性的内容,使用section。但若这段内容完全可以脱离上下文,作为完整的独立存在的一段内容,使用article。粗略来说,使用article的肯定使用section,但是能用article就不要使用section。