生成CSS网格

生成CSS网格 — 指定尺寸或颜色，查看代码或结果. 工具输入在您的设备上处理。无需账号.

无需账号

正在加载工具…

使用方法

请检查输入范围和单位。结果取决于您的输入和浏览器。

广告可能处理连接数据，个性化遵循您的隐私选择。隐私说明（英语）

以下结果由此工具的实际引擎使用示例值计算，不使用个人输入或已保存工作。可在工具中载入示例查看相同输入。

.grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

输入条件

以下为实际输入验证范围，并不保证所有允许值都符合现实或适用于您的情况。