line-height在表格中没反应是因为未作用于真正包裹文字的td/th元素，且可能受font-size:0或父级样式压制；应设在td/th上并配合height、vertical-align和border-collapse等共同控制。
表格里设 line-height 为什么没反应
不是你写错了，是它根本没生效在该起作用的地方。浏览器对 <tr> 的 <code>height 属性支持极差（Chrome 直接忽略），而 line-height 如果只写在 <table> 或 <code><tbody> 上，根本不会向下穿透到文本内容——它必须落在真正包裹文字的容器上。<p>实操建议：</p>
<ul><li>把 <code>line-height 明确加到 <td> 或 <code><th> 上，别省略<li>确认父级没设 <code>font-size: 0（常见于清除 inline 间隙），否则无单位 line-height 算出来就是 0
单行数据表格怎么锁死最小高度
后台列表、状态卡片这类场景，要求每行视觉高度一致，哪怕内容为空或只有一字。靠 line-height 单独撑不够，得配合盒模型控制。
实操建议：
td { line-height: 40px; height: 40px; vertical-align: middle; box-sizing: border-box; padding: 0; }- 必须加
border-collapse: collapse到<table>，否则默认的分离边框会让实际高度浮动<li>避免用 <code>cellpadding或cellspacing—— 它们已废弃，且和 CSS padding/margin 混用时会叠加出意料之外的高度 - 放弃
height和纯line-height，改用min-height: 60px+display: flex; align-items: center;包裹内容 - 若需截断多行文本，用
display: -webkit-box; -webkit-line-clamp: 2; overflow: hidden;，但注意这不保证最小高度，得额外配min-height - 图片务必设
max-height: 100%; height: auto;，否则会突破容器限制 - 给字体加
font-display: swap，让文本先以系统字体渲染，再替换 - 图片用
width和height属性预留空间，或用aspect-ratio配合object-fit - 关键表格区域加
min-height（比如min-height: calc(100vh - 200px)），防白屏期高度坍塌
多行文本或含图片时怎么保最小行高
line-height 对换行、图片、图标完全失效：图片高度不参与行高计算，多行文本会把单元格直接撑开。这时候“最小行高”本质是“最小容器高度”，不能再依赖文本流逻辑。
实操建议：
动态渲染中表格行高跳变怎么办
React/Vue 渲染完，字体还没加载完、图片还没解码，line-height 算出来的行框高度是错的，导致页面“抖动”。这不是样式问题，是资源加载节奏问题。
实操建议：
最易被忽略的一点：表格行高从来不是单一属性能搞定的事。它始终是 line-height、vertical-align、box-sizing、border-collapse 和内容类型（纯文本 / 图片 / 混排）共同作用的结果。调一个值就以为稳了，大概率后面会返工。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
