grid-auto-rows不控制文本行高，仅管理网格隐式行轨道；应优先用无单位line-height、max-height截断、flex列限制等方法调控内容行高。
行高随内容变化太大，本质是文本换行、字体大小、行内元素或盒模型差异导致的自动高度不可控。单纯用 line-height 很难兼顾多行、单行、超长文本和响应式场景。用 grid-auto-rows: minmax(1.5em, 3em) 是一种思路，但要注意：它只对显式定义为 grid 容器、且子项参与自动行轨道分配时才生效（比如用 grid-template-rows: auto 或未设固定行数），并非直接约束单个元素的行高。
明确 grid-auto-rows 的适用场景
grid-auto-rows 控制的是“隐式网格行轨道”的默认尺寸，适用于动态插入子项、且未在 grid-template-rows 中预先定义所有行的情况。例如：
- 一个
display: grid; grid-template-columns: repeat(3, 1fr);的容器，子项数量不固定，靠自动换行生成多行 —— 此时grid-auto-rows: minmax(2rem, 4rem)可限制每行的高度下限和上限； - 但若你只是想让一段文字（如
）自身行高稳定，grid-auto-rows不起作用，因为它不作用于文本流内部的行框（line box），而作用于网格容器的行轨道（grid row track）。
真正控制“内容行高自适应过大”的实用方法
针对段落、标题、卡片内文字等常见场景，更直接有效的做法是组合使用以下属性：
-
设置
line-height为无单位数值（如1.4）：它会相对于当前字体大小计算，比px或em更健壮，避免嵌套时放大效应； -
用
max-height+overflow: hidden或text-overflow: ellipsis（配合display: -webkit-box）截断超出行数，例如限制最多显示 3 行； -
对容器启用弹性行限制：如
display: flex; flex-direction: column;，再给文本容器设min-height和max-height，配合overflow: hidden； -
避免意外的
vertical-align、padding、border或font-size突变，这些常被忽略却显著撑高容器。
如果坚持用 Grid 控制整体布局节奏
可以将文字块作为 grid 子项，并用 minmax() 约束其所在行轨道，同时确保文字自身可控：
立即学习“前端免费学习笔记（深入）”；
.card-grid {
display: grid;
grid-template-rows: minmax(2.5rem, max-content) minmax(4rem, auto);
/* 第一行放标题（最小2.5rem，不压缩），第二行放正文（至少4rem，可随内容略涨） */
}
.card-title { grid-row: 1; }
.card-body { grid-row: 2; line-height: 1.5; } /* 文字内部仍需 line-height 约束 */
这样既利用了 Grid 的布局弹性，又没放弃对文本流本身的控制。
小结：别让工具解决错的问题
grid-auto-rows 是布局层的行轨道管理工具，不是排版层的行高控制器。内容行高失控，优先检查 line-height 值是否合理、父容器是否引入额外 padding/margin、字体是否加载异常、是否有 inline 元素（如图标、sup）抬升基线。Grid 可用于结构兜底，但不能替代对文本渲染逻辑的基本干预。
