无效的属性值CSS值

Question

我已经在多种浏览器中尝试了以下CSS，但是使用grid-template-columns属性并没有成功。

.container {
  background-color: azure;
  display: grid;
  grid-template-columns: 1fr, 1fr, 1fr;
}

CSS抛出错误，指示grid-template-columns无效。

Answer 1

那不是Netlytic值的语法。您需要做的就是删除逗号。

.container {
  background-color: azure;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}

<div class="container">
  <div class="box">1</div>
  <div class="box">2</div>
  <div class="box">3</div>
</div>