为什么嵌套绝对定位会导致元素引用其父级而不是祖父母？

嵌套定位：绝对中的绝对

嵌套绝对定位元素可能会在 CSS 中表现出意想不到的行为。考虑这种情况：

• 第一个 div (#1st) 的位置：相对
• 第二个 div (#2nd) 相对于 #1st 绝对定位
• A第三个 div (#3rd) 绝对定位在 #2nd

问：为什么 #3rd 绝对定位于 #2nd 而不是 #1st？

A：因为绝对定位元素中的position:absolute会重置其子元素的相对位置。

此属性有效地覆盖了#3rd的#1st的相对位置，使其相对于它的直接父级 #2nd。

要实现您想要的行为，其中 #3rd 相对于 #1st 绝对定位，您需要使 #3rd 成为 #1st 的直接子级。

以上是为什么嵌套绝对定位会导致元素引用其父级而不是祖父母？的详细内容。更多信息请关注PHP中文网其他相关文章！