使元素脱离正常流程的 CSS 属性是啥？

Posted 2023-02-21

【中文标题】使元素脱离正常流程的 CSS 属性是啥？

【英文标题】：What are the CSS properties that get elements out of the normal flow?使元素脱离正常流程的 CSS 属性是什么？

【发布时间】：2012-08-08 16:06:05

【问题描述】：

有哪些 CSS 属性可以让元素脱离正常流程？ 此类属性将是 float、position:absolute 等。

这个问题涉及正常流程的所有可能变化。

【问题讨论】：

display 是另一个。我能问下根本问题是什么吗？可能还有其他属性在名义上不会改变流程，但在某些情况下会改变，例如超大边距。

@DavidThomas display:none 肯定会从流程中取出元素，无论流程是什么。

@大卫托马斯：Normal flow

@BoltClock 除了显示：table-*

@DanDascalescu 我发现这里给出的答案是完整的，而不是那个帖子中的答案。

【参考方案1】：

只有以下属性会影响任何给定元素的正常流动：

float: right|left position: absolute|fixed

为了完整性：

display: none从流中移除元素（严格来说元素不会有流序）

position: relative 不会改变元素的流动顺序，而是改变其相对于正常流动位置的位置。

visibility: hidden 将在流中保留元素，但不会将其渲染到视口。