grid-row和grid-column用于控制网格项的行列跨度，支持起始/结束线或span语法，如grid-row:2/span3表示从第2行跨3行，grid-column类似；可结合grid-area简写属性同时设置行列范围，适用于复杂布局场景。
在 CSS Grid 布局中，grid-row 和 grid-column 可以用来控制网格项（grid item）在行和列上的起始和结束位置，从而实现跨行或跨列的效果。
grid-row 跨行
使用 grid-row 可以让一个元素跨越多行。它接受两种写法：起始行 / 结束行，或者只写起始行并配合 span 关键字。
例如：- grid-row: 2 / 4; 表示从第 2 行开始，到第 4 行之前结束（即跨越第 2 和第 3 行，共 2 行）
- grid-row: 2 / span 3; 表示从第 2 行开始，跨越 3 行
- grid-row: span 2; 若未指定起始位置，浏览器会自动计算，默认从当前可用行开始
grid-column 跨列
grid-column 的用法与 grid-row 类似，用于控制元素在列方向上的跨度。
例如：- grid-column: 1 / 3; 表示从第 1 列开始，跨越到第 3 列前（占 2 列）
- grid-column: span 2; 表示自动决定起始列，并向右跨越 2 列
- grid-column: 2 / span 4; 从第 2 列开始，跨越 4 列
简写属性与实际应用
你也可以将行和列一起设置：
立即学习“前端免费学习笔记（深入）”；
- grid-area: row-start / col-start / row-end / col-end;
- 比如 grid-area: 2 / 1 / 4 / 3; 表示从第 2 行第 1 列开始，到第 4 行第 3 列结束（跨 2 行 2 列）
这种设置在布局复杂区域（如页眉、侧边栏、卡片等）时非常实用。
基本上就这些。合理使用 span 和行列范围，能灵活控制元素的网格占据范围，不复杂但容易忽略细节。
