以下是一个使用grid-template的代码示例,将2行设置为100px大小,并将3列设置为50px大小:
.grid-container {
display: grid;
grid-template-rows: 100px 100px;
grid-template-columns: 50px 50px 50px;
}
Item 1
Item 2
Item 3
Item 4
Item 5
Item 6
在这个例子中,通过设置grid-template-rows属性为100px 100px,我们将容器的两行设置为100像素高。然后,通过设置grid-template-columns属性为50px 50px 50px,我们将容器的三列设置为50像素宽。
在容器中,我们添加了六个grid-item作为示例。你可以根据需要添加或删除更多的grid-item。