多行对齐 (Align Content)

控制多行弹性容器中行的对齐方式。

alignContent 属性用于在交叉轴上有剩余空间时,对齐弹性容器内的行。此属性对单行弹性容器(即 flexWrap 为 NoWrap)无效。

取值

值描述
Stretch默认值。行被拉伸以占据剩余空间。
FlexStart行紧凑排列在容器起始位置。
FlexEnd行紧凑排列在容器结束位置。
Center行紧凑排列在容器中间。
SpaceBetween行均匀分布;第一行在起始位置,最后一行在结束位置。
SpaceAround行均匀分布,行与行之间有相等的空间。

此属性也用于 Grid 行的整体对齐,以及 Display.Block / Display.FlowRoot 容器内内容的块轴对齐。例如,高 100 的块容器设置 AlignContent.Center,其高 20 的单个子元素会位于 y = 40。

还支持 Start、End、SpaceEvenly,以及 SafeStart、SafeEnd、SafeFlexStart、SafeFlexEnd、SafeCenter。安全值在内容无法容纳时回退到起始对齐。未设置时读回 undefined;表中的默认行为针对 Flex 布局。

示例

Loading Preview…

后续步骤

© 2026 ByteLand Technology Limited