Rachel Andrew
发布时间：2026 年 1 月 14 日
从 Chrome 145 开始，支持多列布局级别 2 规范中的 column-wrap 和 column-height 属性。借助这些属性，您可以将列在块方向上换行到新行。
在 Chrome 145 之前，如果多列容器的高度受到限制，无法放入可用空间的内容会以溢出列的形式显示在内联方向上。这会在网页上创建水平滚动条。
借助 column-height 和 column-wrap 属性，您可以设置列行的相应高度，并将溢出的列设置为显示为新行。
能够创建新的列行，可避免当前这种两难的局面：要么让用户上下滚动来阅读列，要么在内容量不可预测的情况下冒着出现水平滚动条的风险。
它还支持块方向轮播界面等模式，其中创建的列会填充可用的视口高度。如需读取下一行列，请在块方向上滚动到下一个屏幕。
打造清晰的阅读体验
如果列有多行，可能会造成不清晰的阅读体验，读者可能不会注意到有多行，而是跳过间隙继续向下阅读列。这是界面设计中应考虑的因素。即将推出的在行间距中添加装饰的功能将为您提供一种额外的工具来创建这种视觉区分。
行规则即将推出
多列级别 1 规范包含用于设置列分隔线样式的属性；此分隔线位于列之间的间隙中。用于设置行规则样式的属性包含在新的 CSS Gap Decorations 规范中，该规范目前处于开发者试用阶段。一旦此功能稳定下来，您便可以在网格、Flexbox 和多列布局中添加行规则和列规则。