我最近意识到 position: static
是多么无用,除非 relative
也可以,否则它不会为您提供任何东西。
事实上,我的问题是“为什么不将这一行添加到我们的 CSS 文件中?”
* { position:relative; }
所以我们总是能够轻松地将任何元素 absolute
放置在它的父元素中,或者通过 left: ...
或相同的方式移动元素 It self任何方向。
那么为什么默认情况下元素没有定位到relative
?
谢谢
最佳答案
让我们将一些处于默认静态状态的元素设为 position: relative;。仅通过单独更改该值,什么也不会发生。它出现在与更改前完全相同的位置。但它确实改变了两件事:
- 它的原始位置仍将被该元素占据(就像原始元素的幽灵仍然在那里占据空间一样)。
- 如果该元素具有绝对定位的子元素,则它们现在绝对定位在此元素的上下文中。
优势
如果所有元素都以相对定位开始,那么您自然会拥有上面的所有两项。您的 top/right/bottom/left 值的工作方式与您假设的一样。 Z-index 也“正常工作”。定位上下文始终受限于下一个父元素,这是合乎逻辑的。
缺点
最值得注意的是,始终将定位上下文限制在父元素是有限制的。假设您想将一个元素定位在页面的右上角,而不管该元素出现在标记中的什么位置。如果元素被隐藏在层次结构中,那将很难做到。您需要为每个父元素重置该定位上下文。这意味着将它们设置回 position: static;,并在此过程中失去相对定位的所有好处。
关于css - 为什么不将默认位置设置为相对位置?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38110802/