在 CSS Grid 布局中，如何处理跨行、跨列的布局问题？

Question

当一个网格项跨越多行多列时，如何处理内容的对齐与布局？

Answer 1

在 CSS Grid 布局中，跨行或跨列时，可以使用 grid-column 和 grid-row 属性指定元素跨越的行数或列数：

.item {
  grid-column: 1 / 3; /* 跨越第一到第三列 */
  grid-row: 1 / 2;    /* 跨越第一行 */
}