grid-auto-columns:"1fr 1fr 1fr 1fr"; grid-auto-rows:"3fr 3fr 1fr 5fr"; 怎么报错

这两个属性的写法没有问题，但是需要将它们放在一个网格容器的声明中，例如：

.container {
  display: grid;
  grid-auto-columns: 1fr 1fr 1fr 1fr;
  grid-auto-rows: 3fr 3fr 1fr 5fr;
}

如果还是报错，请提供更多的上下文和错误信息。

相关问题

.container { display: grid; grid-template-columns: 7fr 3fr; grid-template-rows: auto; height: calc(100vh - 4rem); }固定左右大小

你可以使用 `grid-template-areas` 来指定左右两个区域的大小，例如：

.container {
  display: grid;
  grid-template-columns: 7fr 3fr;
  grid-template-areas: "left right";
  height: calc(100vh - 4rem);
}

.left {
  grid-area: left;
}

.right {
  grid-area: right;
}

然后在 HTML 中为左右两个区域分别创建对应的元素，并设置它们的 `grid-area` 属性为 `left` 和 `right`，例如：

<div class="container">
  <div class="left">左侧区域</div>
  <div class="right">右侧区域</div>
</div>

grid-template-columns: repeat(6, 1fr); grid-template-rows: repeat(4, 1fr);

这是CSS Grid布局中用来定义网格列和网格行的属性。其中，`grid-template-columns`定义了6列，每列的宽度为父容器宽度的1/6，`grid-template-rows`定义了4行，每行的高度为父容器高度的1/4。这意味着会创建一个6列4行的网格布局。在这个网格布局中，每个单元格的大小都相同。