CELLPADDING已废弃，必须用CSS padding替代；它仅控制单元格内容到边框距离，与文字行高、字间距无关，应作用于td/th元素而非table，支持多方向、响应式及单位灵活设置。
CELLPADDING不是用来控制文字间距的
它只影响单元格内容（包括文字、图片等）到该单元格自身边框的距离，和文字行高、字间距（letter-spacing）、词间距（word-spacing）完全无关。常见误解是调大cellpadding就能“让文字更松散”，实际只是把文字整体往外推，行内间隙没变——真正管文字疏密的是line-height、letter-spacing这些CSS属性。
用CSS padding替代cellpadding的实操写法
目标必须落在td和th上，而不是table标签本身：table设padding无效，浏览器会忽略。
- 统一设置：写
td, th { padding: 8px 12px; }，上下8px、左右12px - 差异化控制：给特定列加
class="status-cell"，再配.status-cell { padding: 4px 6px; } - 响应式缩放：用
@media (max-width: 768px) { td, th { padding: 4px 6px; } }在小屏收紧 - 避免单位陷阱：用
em或rem时，若父容器font-size动态变化，padding值会浮动；日常开发优先用px或固定rem
为什么直接删掉cellpadding属性可能出问题
老项目里硬编码的cellpadding="5"如果直接删掉，所有单元格内边距会回退到浏览器默认值（通常是1–2px），视觉上突然收紧，容易漏测。稳妥过渡方式是：
- 保留原有
cellpadding属性，同时加等效CSS：td, th { padding: 5px; } - 若需JS动态读取旧值：
document.querySelectorAll('td, th').forEach(el => el.style.padding = el.parentElement.cellPadding + 'px') - 注意：
table.cellPadding是DOM属性，修改它不会触发CSS transition动画；而直接改style.padding或class可以
容易被忽略的细节：border-collapse对padding的影响
当表格用了border-collapse: collapse（默认值），单元格边框会合并，此时padding依然生效，但border-spacing失效。很多人误以为“撑不开行高”是padding不够，其实更可能是line-height太小或min-height未设——padding只推内容，不拉高行框；真正控行高的，是line-height或min-height。
立即学习“前端免费学习笔记（深入）”；
