CSS 网格布局问题有人能解决这个布局吗

Question

请使用

50px(green color)

使水从

last 5th row(green color)

之后流到

CSS grid

，并且在一行代码中还有图像解释！

任何与问题相关的疑问请随时问我！

请使用

50px(green color)

以及一行代码让水从

last 5th row(green color)

之后流到

CSS grid

。

Answer 1

使用 grid-template-rows 时，您可以将行指定为“0”。如果将第一行设置为 50px，您将获得所需的特定高度。然后计算出有多少行。在本例中，您总共需要指定 5 行。

50px（指定顶行），0（声明有一行，但没有高度，但需要使用3次才能指定3行的高度）1fr（Fr是小数单位，1fr是1的一部分可用空间，因为一行是 50px，3 行是“0”，1fr 将跨越剩余可用空间的 100%。）

答案：

网格模板行：50px 0 0 0 1fr;