2.2.3 使用div
有时需要在一段内容外围包一个容器，从而可以为其应用CSS样式或JavaScript效果。如果没有这个容器，页面就会不一样。在评估内容的时候，考虑使用article、section、aside、nav等元素，却发现它们从语义上来讲都不合适。
这时，真正需要的是一个通用容器，一个完全没有任何语义含义的容器。这个容器就是div元素，用户可以为其添加样式或JavaScript效果。
【示例1】为页面内容加上div元素以后，可以添加更多样式的通用容器。
<div>
<article>
<h1>文章标题</h1>
<p>文章内容</p>
<footer>
<p>注释信息</p>
<address><a href="#">W3C</a></address>
</footer>
</article>
</div>
现在有一个div包着所有的内容，页面的语义没有发生改变，但现在我们有了一个可以用CSS添加样式的通用容器。
与header、footer、main、article、section、aside、nav、h1～h6、p等元素一样，在默认情况下，div元素没有任何样式，只是其包含的内容从新的一行开始。不过，我们可以对div添加样式以实现设计效果。
div对使用JavaScript实现一些特定的交互行为或效果是有帮助的。例如，在页面中展示一张照片或一个对话框，同时让背景页面覆盖一个半透明的层（这个层通常是一个div）。
尽管HTML用于对内容的含义进行描述，但div并不是唯一没有语义价值的元素。span是与div对应的一个元素，div是块级内容的无语义容器，而span是短语内容的无语义容器。例如，span可以放在段落元素p之内。
【示例2】对段落文本中的部分信息进行分隔显示，以便应用不同的类样式。
<h1>新闻标题</h1>
<p>新闻内容</p>
<p>......</p>
<p>发布于<span class="date">2016年12月</span>，由<span class="author">张三</span>编辑</p>
提示：在HTML结构化元素中，div是除了h1～h6以外唯一早于HTML5出现的元素。在HTML5之前，div是包围大块内容（如页眉、页脚、主要内容、插图、附栏等）的，从而成为CSS为之添加样式的不二选择。之前div没有任何语义含义，现在也一样，这就是HTML5引入header、footer、main、article、section、aside和nav元素的原因。这些类型的构造块在网页中普遍存在，因此它们可以成为具有独立含义的元素。在HTML5中，div并没有消失，只是使用它的场合变少了。
为article和aside元素分别添加一些CSS样式，让它们各自成为一栏。在大多数情况下，每一栏都有不止一个区块的内容。例如，主要内容区第一个article下面可能还有另一个article（或section、aside等元素）。又如，也许想在第二栏再放一个aside显示指向关于其他网站的链接，或许再添加一个其他类型的元素。这时可以将期望在同一栏出现的内容包在一个div里，然后对这个div添加相应的样式。但是不可以用section，因为该元素并不能作为添加样式的通用容器。
div没有任何语义。大多数时候，使用header、footer、main（仅使用一次）、article、section、aside或nav代替div会更合适。但是，如果语义上不合适，也不必为了刻意避免使用div而使用上述元素。div适合所有页面容器，可以作为HTML5的备用容器使用。