white-space: nowrap 在表格中常无效，因 td 缺少 width、table-layout: auto 且非块级；需三步配合：table-layout: fixed、明确列宽、td display: block 才能生效。
只写 white-space: nowrap 在表格里大概率没用，必须配合 table-layout: fixed、明确的列宽和块级显示行为才能生效。
为什么 td 里加 white-space: nowrap 还是换行
表格默认是内容驱动布局，white-space: nowrap 的“不换行”逻辑依赖浏览器能判断“哪里算超出”，但：
• td 没设 width 或 max-width，宽度由内容撑开，根本不存在“溢出”概念
• 表格默认使用 table-layout: auto，列宽动态计算，nowrap 失去约束基准
• td 是内联表格单元格，不是块级容器，white-space 的作用范围受限
• 父级 table 或 colgroup 有其他样式（如 word-break: break-word）会覆盖掉 nowrap
真正起效的三步配置
必须同时满足以下条件，white-space: nowrap 才能在表格中稳定禁换行：
- 给
table加table-layout: fixed—— 强制按列定义宽度，而非内容自适应 - 给目标
td或其父col设明确宽度，例如width: 120px或max-width: 150px - 给
td加display: block或display: inline-block—— 让它具备块级渲染上下文，white-space才能完整生效
示例：
table {
table-layout: fixed;
width: 100%;
}
td.no-wrap {
width: 120px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
display: block;
}
<td nowrap> 能不能直接用<p>可以，但仅限兼容性兜底场景：</p>
<ul><li><code><td nowrap> 是 HTML4 布尔属性，在所有现代浏览器中仍被支持，但 HTML5 已弃用
<li>它不依赖 CSS，也不需要额外样式，写上就生效，适合快速原型或遗留系统维护</li>
<li>但它无法配合 <code>text-overflow: ellipsis，也不能控制溢出隐藏，纯靠“硬撑”，容易撑破表格结构
contenteditable 的 td 怎么彻底禁换行
即使加了 white-space: nowrap 和 display: block，用户按 Enter 仍会插入 <div> 或 <code><p></p>，导致 DOM 多行 —— 此时 CSS 完全失效：
- 必须监听
keydown，对e.key === 'Enter'调用e.preventDefault() - 监听
paste，用e.clipboardData.getData('text/plain')提取纯文本，并.replace(/[\r\n]/g, '')清除换行符 - Safari 下还需加
-webkit-appearance: none，否则默认contenteditable样式可能干扰光标定位
真正难的不是不让它视觉换行，而是不让换行行为进入 DOM；一旦节点结构变复杂，white-space 就彻底失能。
