css display：grid

CSS的display属性用于设置元素的显示类型。其中，display: grid可用于创建一个网格布局，将元素放置在规则的行和列中。

通过设置display为grid，可以将元素的直接子元素作为网格项，并使用grid-template-rows和grid-template-columns属性定义网格的行和列。例如：

.container {
  display: grid;
  grid-template-rows: 100px 100px; /* 定义两个行，每个行高100px */
  grid-template-columns: 1fr 1fr; /* 定义两个列，每个列宽相等 */
}

在上述示例中，.container是包含网格布局的父元素，它的直接子元素将成为网格项。通过设置grid-template-rows和grid-template-columns属性，可以指定网格的行和列的大小。

你可以使用grid-row和grid-column属性来指定每个网格项在网格中的位置。例如：

.item {
  grid-row: 1 / 2; /* 网格项从第1行到第2行 */
  grid-column: 2 / 3; /* 网格项从第2列到第3列 */
}

通过调整grid-row和grid-column的值，你可以将网格项放置在所需的位置。

网格布局提供了更灵活的布局方式，可以实现复杂的网页布局效果。希望这个简单的介绍对你有帮助！如果你有更多问题，我会尽力回答。