cellpadding是table标签属性，统一设置所有单元格内容与边框间距，单位像素，现代项目应改用CSS padding替代。
cellpadding 能控制文字与边框的留白，但只在旧 HTML 中有效，现代项目里它已被 CSS padding 取代——直接写 cellpadding="10" 看似简单，实际容易踩坑。
cellpadding 是什么、怎么用
cellpadding 是 <table> 标签的属性，不是 <code><td> 或 <code><th> 的。它统一设置整张表所有单元格内容到边框的距离，单位是像素（无单位，默认就是 px）。
<ul><li>写法必须是：<code><table cellpadding="8">，加在 <code><td> 上完全无效
<li>值为 0 时，文字会紧贴边框；设为 10 就是上下左右各留 10px 空隙</li>
<li>它对 <code><th> 和 <code><td> 一视同仁，无法单独给表头加大内边距
<li>若表格用了 <code>border-collapse: collapse，cellpadding 仍生效，但视觉上可能被边框合并干扰
为什么写了 cellpadding 却没效果
常见失效原因不是代码写错，而是被其他样式覆盖或渲染逻辑冲突：
- CSS 中写了
td, th { padding: 0; }—— 这会直接压掉cellpadding的作用 - 嵌套表格时，外层
cellpadding不影响内层，但内层没设又继承了浏览器默认（通常是 1–2px），显得不一致 - 用了
border="1"但没设cellspacing="0"，间隙被误认为是内边距不足 - 某些框架（如 Bootstrap）重置了表格样式，
cellpadding被忽略，需手动检查 computed styles
用 CSS padding 替代的实操要点
真正可控、可维护的做法是放弃 cellpadding，改用 CSS：
立即学习“前端免费学习笔记（深入）”；
- 基础写法：
td, th { padding: 6px 12px; }—— 上下 6px，左右 12px，比单值灵活得多 - 差异化控制：
th { padding: 10px; } td { padding: 4px; }，表头留白更大更醒目 - 响应式适配：
td { padding: 0.5rem; }，随根字号缩放，小屏自动收紧 - 避免全局污染：用类名限定范围，比如
.data-table td { padding: 8px; }
遗留系统里保留 cellpadding 的注意事项
老项目不能立刻重构？那得清楚它的边界行为：
-
cellpadding设的是“最小留白”，如果某单元格内容高度高（比如带换行文本或图片），实际内边距会以该行最高单元格为准，其他单元格也会被撑开 —— 这不是 bug，是它的固有逻辑 - 不要和
border-spacing混用：后者只在border-collapse: separate下生效，而cellpadding始终作用于内容区域 - 导出为 Excel 或 PDF 时，部分工具（如某些后端模板引擎）仍依赖
cellpadding解析留白，此时保留它比模拟 CSS 更稳妥
真正麻烦的不是“怎么设留白”，而是留白在不同单元格、不同设备、不同导出场景下的表现不一致——cellpadding 是个开关，padding 才是扳手。别把它当快捷方式，要当控制权。
