CSS grid-auto-columns 屬性
定義和用法
grid-auto-columns
屬性設定網格容器中列的大小。
此屬性僅影響未設定大小的列。
預設值 | auto |
---|---|
繼承 | no |
可動畫 | 是的。 瞭解可動畫屬性 嘗試一下 |
版本 | CSS Grid Layout Module Level 1 |
JavaScript 語法 | object.style.gridAutoColumns="120px" 嘗試一下 |
瀏覽器支援
表中的數字指定了完全支援該屬性的第一個瀏覽器版本。
屬性 | |||||
---|---|---|---|---|---|
grid-auto-columns | 57 | 16 | 52 | 10 | 44 |
CSS 語法
grid-auto-columns: auto|max-content|min-content|length;
屬性值
值 | 描述 | 演示 |
---|---|---|
auto | 預設值。列的大小由容器的大小決定 | 演示 ❯ |
fit-content() | ||
max-content | 根據列中最大的專案設定每列的大小 | 演示 ❯ |
min-content | 根據列中最小的專案設定每列的大小 | 演示 ❯ |
minmax(min.max) | 設定一個大小範圍,該範圍大於或等於min且小於或等於max | |
length | 使用合法的長度值設定列的大小。 瞭解長度單位 | 演示 ❯ |
% | 使用百分比值設定列的大小 | 演示 ❯ |
相關頁面
CSS 教程: CSS Grid 佈局
CSS 參考: grid-auto-rows 屬性