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 屬性