html - 线盒中是否包含块级盒？

w3c规范中是否有指定块级框自动包围在行框中的地方？
背景
我们知道，vertical padding and border of inline boxes do not affect line box height。而行框高度则是影响后续内容位置的内联框的唯一特征。反过来，这意味着内联框上的填充/边框将渗透到周围的内容上。
引用W3CCSS2.1，Chapter 10：
尽管非替换元素的边距、边框和填充没有
进入行框计算，它们仍在
内联框。这意味着如果line-height指定的高度
小于包含的框、背景和
填充和边框的颜色可能会“出血”到相邻的行框中。
注意它是怎么说的：“注入相邻的接线盒”。
我做了一个测试，注意到它实际上也会渗入相邻的块级框中。

.one {
  border: 1px solid green;
}
.two {
  border: 1px solid red;
}
.three {
  line-height: normal;
  border: 1px solid blue;
  padding: 10px 0;
}

  <div class="one">test</div>

  <span class="two">
    <span class="three">test two</span>
    x
  </span>

因此，我想知道，规范中有没有规定块级框也被线框包围？我只能在inline formatting context下找到相关的行框详细信息，其中只有内联级别的框参与。
谢谢您。

最佳答案

我不确定一个块级别的框是否可以说是与一个线框相邻（反之亦然）。然而，在您的示例中，实际上有两个行框，一个是在通过建立内联格式上下文格式化其内联内容时由div.one生成的，另一个是在格式化body时由span.two元素（及其span.three子元素）生成的，可以说div.one中的行框与包含span.two和span.three。
为了绘制内联框，与包含这些内联框的块容器相邻的每个行框由哪个块容器生成并不重要。任何块容器是否也建立块格式上下文都无关紧要。这就是为什么你会看到span.three的内联框流入div.one内部的内联框。
块级别的框不能直接与行框共存，并且通过“块级别”的定义，它也不能被封装在一个行箱中（以回答您的标题）。在您的示例中，呈现spans的行框位于anonymous block box中，该行框随后作为div的同级。匿名块框为spans建立自己的内联格式上下文，就像div为其文本所做的那样。