6.5 盒子的生成
块级元素生成块级盒子，行内级元素生成行内级盒子，display: none的元素不生成盒子。文本可能生成匿名盒子。
（1）生成匿名的块盒子。
<body>
<div>
小步教程
<div>xiaobuteach.com</div>
小步教程2
</div>
</body>
开发者工具查看“小步教程”文本盒子的display值为block。能够选中它并查看样式，说明它是一个盒子，一个匿名盒子。
外部div包含三个子元素：两处文本，一处div元素，两处文本没有标签直接标记。这不是标准树状结构，浏览器解析时为文本生成匿名盒子。示意解析结果如下。
<body>
<div>
<匿名div>小步教程</匿名div>
<div>xiaobuteach.com</div>
<匿名div>小步教程2</匿名div>
</div>
</body>
（2）生成匿名的行内盒子。
<body>
<div>
小步教程
<span>xiaobuteach.com</span>
小步教程2
</div>
</body>
开发者工具查看“小步教程”文本盒子的display值为inline。能够选中它并查看样式，说明它是一个盒子，一个匿名盒子。
外部div包含三个子元素：两处文本，一处span元素，两处文本没有标签直接标记。这不是标准树状结构，浏览器解析时为文本生成匿名盒子。示意解析结果如下。
<body>
<div>
<匿名span>小步教程</匿名span>
<span>xiaobuteach.com</div>
<匿名span>小步教程2</匿名span>
</div>
</body>
（3）匿名盒子的基本概念
匿名盒子是为保证HTML代码的完整树状结构生成的盒子，无法直接设置它的样式，它继承祖先元素的样式，通常它们的编码不存在直接标签进行标记。::before、::after、 ::marker 等元素虽然也没有直接标签，但能够通过选择器直接设置样式，不属于匿名盒子。
（4）一个块容器（例如div）内部，要么全部是块级元素（例如div），要么全部是行内级元素（例如span） 。
代码示例如下
<div>
小步教程
<span>xiaobuteach.com</span>
小步教程2
<div>小步教程3</div>
</div>
浏览器示意解析结果如下
<div>
<匿名div>
<匿名span>小步教程</匿名span>
<span>xiaobuteach.com</span>
<匿名span>小步教程2</匿名span>
</匿名div>
<div>小步教程3</div>
</div>
