HTML5div怎么使用,HTML5 使用div元素

■知识点

有时需要在一段内容外围添加一个容器，从而可以为其应用CSS样式或JavaScript效果。如果没有这个容器，页面就会不一样。在评估内容的时候，考虑使用article、section、aside、nav等元素，却发 现它们从语义上来讲都不合适。

这时，真正需要的是一个通用容器，一个完全没有任何语义含义的容器。这个容器就是div元素，用户可以为其添加样式或JavaScript效果了。

■实例设计

【示例1】下面的示例为页面内容加上div以后，可以添加更多样式的通用容器。

文章标题

文章内容

注释信息

W3C

现在有一个div包着所有的内容，页面的语义没有发生改变，但现在有了一个可以用CSS添加样式的通用容器。

与 header、footer、main、article、section、aside、nav、hl~h6、p 等兀素一样，在默认情况下，div 元素自身没有任何默认样式，只是其包含的内容从新的一行开始。不过，我们可以对div添加样式以实现设计。

div对使用JavaScript实现一些特定的交互行为或效果也是有帮助的。例如，在页面中展示一张图片或一个对话框，同时让背景页面覆盖一个半透明的层(这个层通常是一个div)。

尽管HTML用于对内容的含义进行描述，但div并不是唯一没有语义价值的元素。span是与div对应的一个元素：div是块级内容的无语义容器，而span则是短语内容的无语义容器，例如它可以放在段 落元素p之内。