无效的属性值CSS值

Question

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

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

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

Answer 1

那不是grid-template-columns值的语法。 您需要做的就是删除逗号。

 .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>