css网格属性值无效

Question

在 Chrome 和 Firefox 中，每晚设置此属性时都会出现以下错误：

grid-template-columns: repeat(auto-fill);
grid-template-rows: repeat(auto-fill, 1fr);

Invalid property value

查看repeat()语法时，似乎我输入正确？两种浏览器似乎仍然以某种方式使其工作，但似乎很奇怪我会收到错误

Answer 1

问题是repeat()需要两个参数（意思repeat(auto-fill)是无效的），以及auto-repeat（auto-fill或者auto-fit）需要一个确定的轨道大小：

该<auto-repeat>变体可以自动重复以填充空间，但需要确定的轨道大小，以便可以计算重复次数。它在曲目列表中只能出现一次，但同一个曲目列表中也可以包含<fixed-repeat>s。

一个确定的值定义为：

无需进行布局即可确定的尺寸；也就是说，一个<length>文本度量（不考虑换行），初始包含块的大小，或一个<percentage>或其他公式（例如非替换块的“拉伸适合”大小 [CSS2]）仅针对确定的大小进行解析。

因此，repeat(auto-fill, 1fr)无效，但repeat(auto-fill, 100px)有效。