应使用CSS padding设置td/th内边距，因cellpadding在HTML5中已过时：它只能全局设于table标签、仅支持px单位、无法响应式缩放且不支持!important覆盖。

直接用 padding 设置 <td> 或 <code><th> 元素，别碰 <code>cellpadding —— 它在 HTML5 中已过时，且无法单独控制方向或响应式缩放。

为什么不能用 cellpadding？

虽然 cellpadding 还能在部分浏览器里“凑合用”，但它有硬伤：

使用华数设计生成高保真HTML原型、演示文稿、动画和设计评审

使用经过文档化的设计技能，从真实的品牌或项目背景中生成HTML原生原型、幻灯片、动态演示、可视化图表和评审流程。

下载

• 只能写在 <table> 标签上，全局生效，没法给某一行、某一列或某个单元格单独设值 <li>单位固定是像素（px），不支持 <code>em、rem、百分比等现代单位
• 与 CSS 的层叠规则无关，无法被 !important 覆盖，也无法用媒体查询做响应式调整
• W3C 已明确将其标记为“obsolete”，HTML5 文档中不再推荐使用

padding 怎么写才管用？

关键点不是“加了 padding 就行”，而是要确保边框不撑开、样式不被覆盖。常见写法如下：

• 统一设置所有单元格：td, th { padding: 12px; }
• 上下左右分别控制：td { padding: 8px 16px 12px 20px; }（顺序：上 右 下 左）
• 只调垂直方向内边距：th { padding-top: 10px; padding-bottom: 10px; }
• 配合 border-collapse: collapse 使用，避免 padding 和 border 叠加出意外间距

容易被忽略的兼容性细节

实际项目里踩坑最多的地方往往不在写法本身，而在组合行为：

立即学习“前端免费学习笔记（深入）”；

• border-collapse: separate（默认值）下，padding 会和 border-spacing 共同影响视觉间距；切记先设 border-collapse: collapse 再调 padding
• 如果表格用了 display: table-cell 模拟单元格，padding 依然有效，但 vertical-align 会影响内容对齐效果
• 某些旧版 Outlook 邮件客户端会忽略 <style></style> 块里的 td padding，必须改用内联样式：<td style="padding: 10px"> <li>用 <code>rem 单位时，若根字体大小动态变化（比如用户缩放页面），padding 也会跟着变——这通常是优点，但若需绝对稳定，得锁定 html { font-size: 16px; }

真正麻烦的从来不是“怎么加内边距”，而是加完之后发现表头和数据行高度不一致、打印预览错位、或者移动端文字贴边——这些几乎都源于没同步处理 border-collapse 和 box-sizing。动手前先扫一眼 computed styles 里的 actual padding 值，比猜更可靠。