目录

CSS grid-auto-columns 属性

❮上一节完整的CSS参考下一节❯

示例

设置网格中列的默认大小：

.grid-container {
display: grid;
grid-auto-columns: 50px;
}

亲自试一试 »

定义和用法

这个grid-auto-columns属性设置网格容器中列的大小。

该属性仅影响未设置大小的列。

展示演示❯

默认值：	汽车
遗传：	不
可动画：	是的。阅读可动画的尝试一下
版本：	CSS 网格布局模块级别 1
JavaScript 语法：	对象.style.gridAutoColumns="120px"尝试一下

浏览器支持

表中的数字指定完全支持该属性的第一个浏览器版本。

Property
grid-auto-columns	57	16	52	10	44

CSS 语法

grid-auto-columns: auto|max-content|min-content| length;

属性值

Value	Description	Demo
auto	Default value. The size of the columns is determined by the size of the container	Demo ❯
fit-content()
max-content	Sets the size of each column depending on the largest item in the column	Demo ❯
min-content	Sets the size of each column depending on the smallest item in the column	Demo ❯
minmax(min.max)	Sets a size range greater than or equal to min and less than or equal to max
length	Sets the size of the columns, by using a legal length value. Read about length units	Demo ❯
%	Sets the size of the columns, by using a percent value	Demo ❯

相关页面

CSS 教程：CSS 网格布局

CSS 参考：网格自动行属性

❮上一节完整的CSS参考下一节❯