绝对定位元素的包含块是什么？似乎规则可能有点复杂......
规范应该在这里： http://www.w3.org/TR/CSS21/visudet.html#containing-block-details
我想验证以下是否属实：
为简单起见，假设包含块是块元素（不是内联元素）...
1）如果绝对定位元素具有位于“非静态”（相对，固定或绝对）的最近祖先，那么该祖先是包含块。绝对定位元素是相对于它的。
2）如果没有这样的祖先，则视口是包含块，因此绝对定位元素是相对于视口的。
无论上面的包含块是什么，宽度：100％或n％和高度：100％或n％都相对于包含块。
这就是
的原因<div style="position:absolute;width:100%;height:100%;background:green"></div>
正好在＆lt; body＆gt;下将完全覆盖整个视口 - 不多也不少。
我们也可以使用position：fixed，除了IE 6不支持它...所以这个可怜的程序员需要使用position：absolute而不是......（好吧，没什么大不了的）
这是绝对定位元素的准确描述吗？如果是这样，我认为IE 6及以上版本，FF，Safari，Chrome都能准确地遵循此行为吗？
答案 0 :(得分：4)
position: relative 除了为中包含的所有元素设置定位上下文外，什么都不做。然后，您可以position: absolute设置其中包含的任何元素，方法是设置top，right，bottom或left中的（通常为一个或两个）值。
如果您为某个元素添加position: relative top，right，bottom或left值，则会相应地改变位置，但会留下空格默认情况下的位置。换句话说，它仍然在文档流程中但是偏移。
position: absolute 要绝对定位，你需要问' 绝对，但相对包含哪个元素'？它将是整个正文（默认）或页面上已定位的其他元素（通常使用relative或absolute - fixed也很有用{{3} }）。然后将其从文档流中取出 - 其他元素可能会出现在它下面，但不会在它周围流动。如果它出现在另一个元素后面，则需要设置supported in IE 7 but see this bug以将其移到前面。
一个常见的解决方案是让一个带margin: 0 auto的居中容器（position: relative），其中的其他项目放在position: absolute。
最后，我喜欢这个小z-index property。
答案 1 :(得分：3)
你是对的。包含块是最后一个定位的元素。所以如果你想明确设置容器，那么给它位置：relative。大多数浏览器都是正确的。 CSS实际上并没有“视口”，我认为顶部是HTML元素，但不要让我这么做。 7之前的IE在HTML之上有一个未命名的元素。