CSS column-fill 属性
更多“自己尝试”的例子见下文。
定义和用法
column-fill
属性指定如何填充列,平衡与否。
提示:如果为多列元素添加了高度,则可以控制内容如何填充列。内容可以平衡填充,也可以按顺序填充。
浏览器支持
表中的数字指定了完全支持该属性的第一个浏览器版本。
属性 | |||||
---|---|---|---|---|---|
column-fill | 50 | 10 | 52 | 10 | 37 |
CSS 语法
column-fill: balance|auto|initial|inherit;
属性值
值 | 描述 | 演示 |
---|---|---|
balance | 默认值。使每列的内容大致相等,但不会让列的高度超过指定的高度(因此,由于浏览器将内容均匀分布在水平方向上,列可能会比指定高度短)。 | 演示 ❯ |
auto | 填充每一列,直到达到指定高度,然后继续填充,直到内容用完(因此,此值不一定会填充所有列,也不会均匀填充它们)。 | 演示 ❯ |
initial | 将此属性设置为其默认值。阅读关于initial | |
inherit | 从其父元素继承此属性。阅读关于inherit |
更多示例
相关页面
CSS 教程: CSS 多列
HTML DOM 参考:columnFill 属性