css - 位置:absolute change element's overlay properties?如何

Question

在例子中here ，我注意到如果你从第一部分元素中去掉 margin-left:200px，它会扩展它的宽度以完全匹配容器，但它不会低于 nav 元素，它有position:absolute。相反，它被 nav 元素覆盖，就好像它具有较低的 z-index 一样。这是为什么？这两个元素不都在文档流中吗？那么这意味着它们应该一个接一个地出现，section 元素出现在 nav 元素下面(当我删除 position:absolute 时会发生这种情况)？为什么它们相互重叠？

Answer 1

Aren't both these elements in the flow of the document?

不! position: absolute; 特别是从流中删除 元素。

如 this answer 中所引用，绝对定位使用current positioning context .具有 position: absolute; 的元素仍受其父元素影响，但它完全独立于其兄弟元素。