css grid布局显示网格线
时间: 2024-01-14 22:03:52 浏览: 162
css的grid网格布局
CSS Grid布局可以通过设置`grid-template-columns`和`grid-template-rows`属性来显示网格线。下面是一个示例:
```css
.container {
display: grid;
grid-template-columns: 100px 100px 100px;
grid-template-rows: 100px 100px 100px;}
```
在这个示例中,`.container`是一个包含网格布局的容器。通过`grid-template-columns`和`grid-template-rows`属性,我们可以定义网格的列和行的大小。在这个例子中,我们定义了3列和3行,每个单元格的大小为100px。
通过这样的设置,网格线将会在容器中显示出来,形成一个3x3的网格。你可以根据需要调整列和行的数量以及单元格的大小。
阅读全文