Css 未设置top时，为什么位置：绝对div不与其同级重叠

上下文：当

位置：绝对

直接位于

中，并且在中有一个

作为它的同级

问题：当未明确设置

top

属性时，为什么

位置：绝对
与其同级不重叠

根据我的理解，但可能不正确，如果将
设置为
位置：绝对
，则如果其父对象和父对象的父对象均未设置为
位置：相对
，则它将相对于身体定位。因此，
top
位置的属性：绝对
应默认为
主体
原点，两个
div
应重叠

代码如下：


#框1{
宽度：200px；
高度：200px；
背景：绿色；
}
#方框2{
位置：绝对位置；
左：200px；
宽度：200px；
高度：200px；
背景：蓝色；
}
更新答案：

这是因为默认的
top
值是
auto
，因此它允许浏览器计算上边缘位置

发件人：

对于绝对定位的图元，图元的位置为
基于
bottom
属性，而
height:auto
被视为
基于内容的高度；或者如果
bottom
也是
auto
，则
元素被放置在它应该垂直放置的位置，如果
它们是静态元素

因此，它将根据
底部
或
顶部
进行定位，但由于在您的示例中没有，因此将其定位为静态元素


旧答案：

因为您设置了
bottom:0所以它粘在底部。
更新答案：

这是因为默认的
top
值是
auto
，因此它允许浏览器计算上边缘位置

发件人：

对于绝对定位的图元，图元的位置为
基于
bottom
属性，而
height:auto
被视为
基于内容的高度；或者如果
bottom
也是
auto
，则
元素被放置在它应该垂直放置的位置，如果
它们是静态元素

因此，它将根据
底部
或
顶部
进行定位，但由于在您的示例中没有，因此将其定位为静态元素


旧答案：

因为您设置了
bottom:0因此它会贴在底部。
如果你有与你的问题相关的代码，那么直接将该代码包含在你的问题中；不要链接到您托管该代码的远程网站。如果您有与您的问题相关的代码，请将该代码直接包含在您的问题中；请不要链接到托管该代码的远程网站。对不起，我刚才发布了一个错误的JSFiddler。我只是简单地将HTML和CSS添加到问题中。你能再看一下吗？很好，非常感谢。MDN比W3CSchool有更好的解释。对不起，我刚才发布了一个错误的JSFiddler。我只是简单地将HTML和CSS添加到问题中。你能再看一下吗？很好，非常感谢。MDN比W3CSchool有更好的解释。