在CSS视觉格式模型中,什么是;元素的流动;什么意思?

在CSS视觉格式模型中,什么是;元素的流动;什么意思?,css,language-lawyer,w3c,Css,Language Lawyer,W3c,在: 如果元素是浮动的、绝对定位的或是根元素,则称其为流出。如果一个元素不是在流中,则在流中调用它。元素A的流是由A和最近流出祖先为A的所有流入元素组成的集合 我能理解流出和流入的意思,但我不明白最后一句话中“最近的流出祖先”是什么意思。有人能提供一个简单的例子吗?从你问题中的定义来看,它似乎并不复杂。在下面的示例中 div{ 边框:1px实心; 利润率:10px; } .断流{ 浮动:左; } #1是流动的 #1a正在流动中 #2是流动的 #2a不流动 #3号车出故障了 #3a正在流动中

在:

如果元素是浮动的、绝对定位的或是根元素,则称其为流出。如果一个元素不是在流中,则在流中调用它。元素A的流是由A和最近流出祖先为A的所有流入元素组成的集合


我能理解流出和流入的意思,但我不明白最后一句话中“最近的流出祖先”是什么意思。有人能提供一个简单的例子吗?

从你问题中的定义来看,它似乎并不复杂。在下面的示例中

div{
边框:1px实心;
利润率:10px;
}
.断流{
浮动:左;
}

#1是流动的
#1a正在流动中
#2是流动的
#2a不流动
#3号车出故障了
#3a正在流动中
#4号车出故障了
#4a流量不足
如果元素是浮动的、绝对定位的或是根元素,则称其为流出

如果元素处于浮动状态,
位置:绝对值
位置:固定值
元素,则该元素不流动

如果一个元素不是在流中,则在流中调用它

不言自明

元素A的流是由A和最近流出祖先为A的所有流入元素组成的集合


这令人费解得可笑。而且网上似乎没有什么能提供很好的解释。事实上,甚至。

来源:我是CSS规范编辑器

虽然文本中没有明确说明,但从定义中可以看出,只有流外元素(通常包括根元素)才有流。流是指作为流出元素的后代的所有元素,但通过嵌套到另一个流出元素中而“隐藏”的元素除外

例如,在:

<html>
 <body>
  <p id=one>some in-flow text
  <div style="position: absolute;">
   <p id=two>some in-flow text
  </div>
  <p id=three>some in-flow text

流文本中的一些

流文本中的一些

流文本中的一些

有两个out-of-flow元素——HTML元素和DIV元素。HTML元素的“流”本身就是BODY元素和#1和#3;如果您遍历这些元素的祖先树,它们遇到的第一个流出元素就是HTML元素

DIV有自己的流,由它自己和#two组成,因为当你走#two的祖先链时,你首先点击DIV,然后再点击HTML

粗略地说,元素的“流”是在布局中一起工作的一组事物。流出元件(及其子元件)基本上是独立布置的


这个概念并不是很有用,但不用担心。

要找到一个节点
n
最近的流出祖先,从
n
向上遍历DOM到根元素。一旦你发现一个元素是浮动的,绝对定位的,或者是根元素,就停止。但它似乎与问题引用的旧CSS2规范中的语言完全相同。