我敢打赌,grid-template-columns
的使用频率大约是 grid-template-rows
的 10 倍,但也许每个人都错过了它。 Eric Meyer 将一堆行线添加到他的主要站点布局网格中,如下所示
grid-template-rows: repeat(7, min-content) 1fr repeat(3, min-content);
这样,如果您需要使用它们,它们就会为您准备好了。
我喜欢这种模式。对我来说,感觉很好,有两组行,其中各个行可以根据需要展开以接受内容,并在不需要时折叠为零高度,并且在两组之间有一个“空白”行将它们分开。它很灵活,甚至允许我在不重写所有布局样式的情况下向集合中添加更多行。