Html 绝对位置是否使该元素成为包含块?
在css2.1规范中,有一个示例解释如何形成包含块Html 绝对位置是否使该元素成为包含块?,html,css,css-position,Html,Css,Css Position,在css2.1规范中,有一个示例解释如何形成包含块 <P id="p2">This is text <EM id="em1"> in the <STRONG id="strong1">second</STRONG> paragraph. </EM> </P> 这是文本 在 秒 段落 当位置em为静态时,strong的包含块由p建立,但当位置em为绝对
<P id="p2">This is text
<EM id="em1">
in the
<STRONG id="strong1">second</STRONG>
paragraph.
</EM>
</P>
这是文本
在
秒
段落
当位置em
为静态时,strong
的包含块由p
建立,但当位置em
为绝对时,strong
的包含块由em
建立
我浏览了关于包含块的章节,没有发现绝对位置是否会形成一个新的包含块。有什么我遗漏的吗?如果我正确理解你的问题,是的
em
带绝对定位将成为新的包含块。尝试更改此演示中的属性:
p{
//position: absolute;
overflow: hidden;
}
em{
position: absolute;
overflow: hidden;
background: yellow;
padding: 10px;
top: 10px;
}
strong{
padding: 20px;
background: red;
}
我们确定#strong1
是一个未定位的内联框。所以从规范上来说,
[…]如果元素的位置为“相对”或“静态”,则包含的块由最近的块容器祖先框的内容边缘构成
当#em1
不是绝对定位时,它仍然是一个内联框。距离#strong1
最近的块容器祖先框是#p2
,因此#p2
是其包含块
当#em1
处于绝对位置时,它会变成块框,如所示。这使其成为距离#strong1
最近的块容器祖先框,因此#em1
成为其包含块。块盒用作块级块容器盒
那么绝对定位是否会导致元素为相对定位或未定位的框建立包含块?是,但仅当绝对定位导致图元的长方体成为这些长方体的最近块容器祖先时
请注意,这是一个相当简化的情况,因为#em1
中唯一的框是内联框(包括围绕#strong1
的两个匿名内联)。除了并非所有块级框都是块容器(表是块级框的常见示例,而块级框不是块容器框),即使绝对定位确实导致元素生成块框,因为我们在这里讨论的是内联框,很可能内联框的块容器是绝对定位元素中的匿名块框,如果该元素碰巧同时包含块级和内联级框。这一复杂案件的详细情况见
但复杂的情况并不止于此。我之所以说“很可能”是因为匿名块框是否能够建立包含块在CSS2.1中没有定义