嵌套

将多个 <div> 置于另一个 <div> 中是一种常见做法。这通常被称为嵌套元素，并允许进一步将元素划分为子部分或帮助开发人员使用 CSS 样式。

<div class="outer-div"> 用于将两个 <div class="inner-div"> 元素组合在一起; 每个都含有 <p> 元素。

<div class="outer-div">
  <div class="inner-div">
    <p>This is a paragraph</p>
  </div>
  <div class="inner-div">
    <p>This is another paragraph</p>
  </div>
</div>

这将产生以下结果（为清晰起见而应用 CSS 样式）：

嵌套内联元素和块元素在嵌套元素时，你应该记住，有内联元素和块元素。块元素在后台添加换行符，意味着，其他嵌套元素自动显示在下一行中，默认情况下内联元素可以彼此相邻放置

避免深深的 <div> 筑巢

深度且经常使用的嵌套容器布局显示了错误的编码样式。

圆角或一些类似的函数通常会创建这样的 HTML 代码。对于大多数上一代浏览器，都有 CSS3 对应物。尝试尽可能少地使用 HTML 元素来增加内容与标记比率并减少页面加载，从而在搜索引擎中获得更好的排名。

div section 元素不应嵌套深度超过 6 层。