以下是一个简单的例子:
.grid-container {
display: grid;
grid-template-rows: 100px 2fr 1fr; /* 三行,第一行100px,剩余两行按2:1分配剩余空间 */
}
上述示例创建了一个具有三行的网格布局容器,第一行高度为100像素,而剩余的两行按2:1的比例分配剩余空间。
请注意,你可以使用不同的长度单位、百分比或 fr(分数单位)来定义行的大小,以满足布局需求。
转载请注明出处:http://www.pingtaimeng.com/article/detail/6082/CSS