外部大小确定(CSS 内部和外部大小调整模块级别 3)

  • 本文关键字:外部 模块 调整 内部 CSS html css
  • 更新时间 :
  • 英文 :


在 CSS Intrinsic & Extrinsic Ssize Module Level 3 规范的 Extrinsic Size Determination 一章中,我们可以阅读:

有时是百分比大小的盒子包含块的大小 取决于盒子本身的内在尺寸贡献,创建 循环依赖。在计算包含块的大小时, 百分比表现为自动。然后,除非另有说明,否则当 计算包含块的已用大小和位置 内容:

  • 如果循环依赖关系是由于包含块上的块大小或最大块大小而引入的,导致它依赖于其内容的大小,框的百分比不解析,而是 表现为自动。

  • 否则,将根据包含块的大小解析百分比。(包含块的大小不会根据 结果盒子的尺寸;内容因此可能会溢出或 下溢包含块(。

和:

注意:这些规则指定了以前未定义的行为 CSS2§10.2 中的循环大小写。另请注意,在 CSS2§10.5 在各自的规范中被取代 CSS2 中未描述的布局模式(如 flex 布局(。

因此,假设horizontal-tbwriting-mode,我们从第一个项目符号知道子项的百分比高度(又名块大小(设置为auto,如果父大小基于子级(即它们形成循环定义(。

然后,第二个项目符号说百分比实际上是针对周期宽度解决的。因此,在宽度的情况下(与高度不同,在循环情况下在 CSS2 中未定义(,它应该以百分比形式解析。

我的问题对于第二个项目符号,当宽度是周期性的时,如何以百分比形式解析?包含块大小的百分比?


编辑

在示例中,它表明宽度也变得auto,这让我想知道自动转换规则是否应该仅适用于block size(又名horizontal-tbwriting-mode高度(的拼写

错误

对于第二个项目符号,当宽度是周期性的时,如何以百分比形式解析?包含块大小的百分比?

回到第一句引文的第一段,其中包含以下句子:

在计算包含块的大小时,百分比的行为就像自动一样。

这第一步至关重要。除了为内容指定任意大小外,无法确定包含块的大小。该大小是自动的。但是,为了保持一致性,内容的宽度随后计算为指定的百分比,该百分比本身基于此新计算的包含块大小。

多年来,这一直是浏览器的可互操作行为,因此除了现在指定了该行为之外,实际上没有任何变化。

最新更新