Css 显示：块内部显示：内联_Css_Inline

Css 显示：块内部显示：内联

css

Css 显示：块内部显示：内联,css,inline,Css,Inline,我想了解当CSS为display:block的元素是CSS为display:inline的元素的DOM子元素时会发生什么（因此block元素是inline元素的子元素） CSS 2.1规范的章节中描述了这种情况：该示例包括以下规则 body { display: inline } p { display: block } 。。。随附的文字说 BODY元素包含一个块（C1）匿名文本，后跟块级元素，后跟另一块匿名文本（C2）。生成的框将是一个尸体周围的匿名方块，包含匿名块框的围

我想了解当CSS为

display:block

的元素是CSS为

display:inline

的元素的DOM子元素时会发生什么（因此block元素是inline元素的子元素）

CSS 2.1规范的章节中描述了这种情况：该示例包括以下规则

body { display: inline }
p    { display: block }

。。。随附的文字说

BODY元素包含一个块（C1）匿名文本，后跟块级元素，后跟另一块匿名文本（C2）。生成的框将是一个尸体周围的匿名方块，包含匿名块框的围绕C1、P块盒和 C2周围的另一个匿名方块

如果您有一个

display:inline

父元素，并且此父元素有一个子元素

display:block

，则该子元素的存在似乎使父元素的行为类似于
display:block
，而忽略它被定义为
display:inline
（因为父级现在只包含匿名和非匿名块子级，即不再包含任何内联子级）
我的问题是，在这个场景中（有一个
display:block
子对象），那么父对象被定义为
display:inline
而不是
display:block
，两者之间的区别是什么

编辑：我更感兴趣的是理解CSS 2.1标准，而不是各种浏览器实现在实践中的行为方式和是否

第二次编辑：
规范中指出了一个差异。在以下文件中，第二个“块”段落的边框围绕整个段落和页面的整个宽度；而第一个“内联段落”的边框围绕段落内的每一行（即使有几行），且不超过每一行的确切宽度（每行都比页宽短）
…然后，第一个内联段落中的“注意：”变为一个块，该块分割段落（根据规范，段落的第一部分和最后一部分现在位于匿名块中）但是，段落的第一部分和最后一部分周围的边框仍然是“内联”样式的边框：因此，仍然与首先声明
p.one
的
display:block
不同
说明书上有句话说
在导致要生成的匿名块框仍然适用于框和内容例如，如果尸体上已经有了边界元素在上面的示例中边界将围绕C1（开放）绘制在线路的末端）和C2（打开在该行的开头）

“边框样式”属性是唯一可以看到差异的属性类型吗？
它有时取决于确切的
css
定义或浏览器
最常见的是，我看到两种行为：

display:inline
元素中的
display:block
元素使
display:inline
像
display:block
一样，宽度为100%

一个
display:inline
元素只包含
display:block
float:left
或
float:right
元素，不占用空间，就好像里面没有元素一样。
display:block
元素的作用就像它们在另一个
display:block
元素中一样，有时有一些时髦的元素动作取决于
位置

position
和
float
都会使子元素有时具有奇怪的行为，但避免它们会使它们通常像
inline
内联容器不能包含块容器一样工作。发生这种情况时，通常的结果是内联容器在o中转换为块排序以容纳其内容。如果需要一个内联的容器来包含看起来像块的内容，请使用以下方法：

display: inline-block;
内联块属性是一种显示模式，它以内联方式定位容器，内联容器的属性和定义仅应用于容器本身，而不将其子级限制为此类约束。结果是，内联块父级的块容器子级被限制为维度如果父级已定义定义，或可能导致父级维度拉伸以容纳较大的子级，则父级的。设置为“内联块”的容器只能接收提供给块的属性，如宽度或高度，而不会丢失与内联容器关联的默认定位
FF2不支持该属性，因此Ice-Weasel浏览器也不支持该属性。几乎所有其他浏览器都支持该属性，包括IE6，因此您可以使用它，因为除了一小部分仅限于开箱即用Linux发行版的用户外，几乎没有人在使用FF2或Ice-Weasel。
当我阅读时，我发现您r问题实际上是：
当内联框包含块框时，内联框[…]在块周围被打断。打断之前和打断之后的[in]行框被封装在匿名框中，并且块框成为这些匿名框的同级
现在请回答您的问题：这与
不同吗
是的，它是。虽然它仍然是4个盒子（身体周围的匿名方块现在是body block box），但规范告诉区别：
在导致生成匿名块框的元素上设置的属性仍然适用于[generated anonymous block]框和该元素的内容。例如，如果在上述示例中在BODY元素上设置了边框，则边框将围绕C1（ope）绘制
b { display: block; }

display: inline-block;

<BODY style="display: inline; "> This is anonymous text before the P. <P>This is the content of P.</P> This is anonymous text after the P. </BODY>

+- anonymous block box around body ---+ | +- anonymous block box around C1 -+ | | | + | | +---------------------------------+ | | | | +- P block box -------------------+ | | | + | | +---------------------------------+ | | | | +- anonymous block box around C2 -+ | | | + | | +---------------------------------+ | +-------------------------------------+

+-------------------------------------- | This is anonymous text before the P. +-------------------------------------- This is the content of P. --------------------------------------+ This is anonymous text after the P. | --------------------------------------+

+--------------------------------------+ | This is anonymous text before the P. | | | | This is the content of P. | | | | This is anonymous text after the P. | +--------------------------------------+