Css 绝对定位元素的包含块是什么？

绝对定位元素的包含块是什么？看起来规则可能有点复杂

规范应在此处：

我想验证以下内容是否正确：

为简单起见，假设包含的块是块元素（不是内联元素）

1） 如果绝对定位元素有一个最接近的祖先定位为“非静态”（相对、固定或绝对），则该祖先就是包含块。绝对定位元素是相对于它的

2） 如果没有这样的祖先，则视口是包含块，因此绝对定位元素相对于视口

无论上面的包含块是什么，宽度：100%或n%和高度：100%或n%都是相对于包含块的

这就是为什么

<div style="position:absolute;width:100%;height:100%;background:green"></div>

右下方将完全覆盖整个视口——不多也不少

我们也可以使用position:fixed，除非IE 6不支持它。。。所以可怜的程序员需要使用position:absolute来代替。。。（嗯，没什么大不了的）

---

这是对绝对定位元素的准确描述吗？如果是这样，我认为IE6及以上版本、FF、Safari、Chrome都准确地遵循了这一行为？

你是对的。包含块是最后定位的元素。因此，如果要显式设置容器，请为其指定位置：relative。大多数浏览器都能做到这一点。CSS并没有真正的“视口”，我认为顶部是HTML元素，尽管我不这么认为。7之前的IE在HTML上面有一个未命名的元素。

Summary:

位置：相对

除了为其中包含的所有元素设置定位上下文之外，不执行任何操作。然后，您可以通过从可能的

顶部

、

右侧

、

底部

或

左侧

设置（通常为一个或两个）值来定位：绝对它包含的任何元素

如果给元素指定了

位置：relative

a

top

、

right

、

bottom

或

left

值，它将相应地移动位置，但在默认位置留下一个空格。换言之，它保留在文档流中，但会被抵销

位置：绝对位置

要绝对定位某个元素，您需要询问“绝对，但相对于哪个包含元素”？它将是整个正文（默认设置）或页面上已定位的某些其他元素（通常使用

相对
或
绝对
-
固定
也很有用）。然后将其从文档流中取出-其他元素可能会出现在其下方，但不会在其周围流动。如果它出现在另一个元素后面，则需要设置将其向前移动

常见的解决方案是使用一个中心容器（
margin:0 auto
）和
position:relative
，在该容器内放置其他项目，并使用
position:absolute

最后，我喜欢这一点。
因为规范中说“如果没有这样的祖先，包含块就是初始包含块。”和“初始包含块。对于连续介质，它具有视口的尺寸，并锚定在画布原点；它是分页介质的页面区域。”这是一个范围问题。浏览器会找到绝对位置对象的最近父对象，因此您的对象相对于该特定父对象处于绝对位置。当然，最近父对象具有位置：相对。否则，它只服从窗口视口。窗口视口在大多数（如果不是所有）情况下都是主体标记。@LarsH-hahaha:D完全正确！