cellpadding仅控制单元格内容与边框的等距内边距，不控制字间距；其失效主因是css中td/th的padding声明优先级更高，一旦存在即完全取代html属性。

CELLPADDING 不控制“字间间隙”，它控制的是单元格内容整体与边框之间的距离——也就是 td 或 th 的内边距（padding），不是文字内部的字符间距（letter-spacing）或行高（line-height）。

为什么CELLPADDING看起来像没起作用？

常见原因是 CSS 覆盖了它：

• td, th { padding: 4px; } 这类全局样式会直接覆盖 cellpadding 值，哪怕你写了 <table cellpadding="12"> <li>框架（如 Bootstrap）或重置样式表（reset.css）通常默认设了 <code>td, th { padding: 0.5rem; }，优先级更高
• 浏览器 DevTools 里检查 td 元素，看 computed 样式中 padding 是否来自 CSS，而非 HTML 属性
• cellpadding="0" 在某些旧渲染路径下仍可能被识别，但一旦有任意一条更具体的 padding 声明，它就彻底失效

用 CSS 设置单元格内边距的正确写法

目标是作用于 td 和 th，而不是 table：


Article To Html
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
下载
• 别给 <table> 写 <code>padding：表格元素不支持内边距，该声明无效
• 统一设置：td, th { padding: 6px 12px; } —— 上下 6px、左右 12px
• 区分表头和数据单元格：th { padding: 10px 16px 8px; } + td { padding: 6px 12px; }
• 单独调整某个单元格：<td style="padding-left: 24px;">关键列</td>
• 响应式适配：@media (max-width: 768px) { td, th { padding: 4px 8px; } }

CELLPADDING和padding混用时的兼容风险

如果必须兼容老代码，注意这些实际限制：

• revert 在 style="padding: 10px; padding: revert;" 中理论上可回退到 cellPadding 值，但截至 2026 年 7 月，Safari 17+ 和 Chrome 125+ 支持有限，Firefox 仍不稳定
• JS 动态读取：el.parentElement.cellPadding 只在 <table> 直接设置了 <code>cellpadding 属性时才返回数值；若未声明，返回空字符串或 1（浏览器默认值），不可靠
• 嵌套表格中，子表格的 cellpadding 不继承父表格值，每个 <table> 独立解析 <p>真正容易被忽略的点：<code>cellpadding 是整数像素值，且四边均等；而 CSS 的 padding 支持 em、rem、百分比、甚至 calc()，但只要用了任一 CSS padding 声明，HTML 属性就彻底退出舞台——它不是“并存”，而是“被取代”。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！