HTML表格内边距应使用CSS padding属性设置，而非过时的cellpadding；通过作用于<td>和<th>元素，可实现上下左右的精确控制，支持多种单位与响应式设计，符合现代Web开发中结构与样式分离的原则。
HTML Extract
使用 MinerU 从 HTML 页面和文件中提取内容，将 HTML 转换为保持标题、列表、表格及文本层次结构的干净、结构化 Markdown。F...
下载
直接用 padding 设置 td 和 th，别碰 cellpadding
cellpadding 是 HTML4 的遗留属性，W3C 已标记为 obsolete，它只能写在
<table> 上、全局生效、单位固定为 px、无法被
!important 覆盖，也不支持媒体查询。实际项目里只要一加 CSS
padding，
cellpadding 就会被静默忽略——不是浏览器 bug，是层叠规则本就如此。
- 所有单元格统一设值：
td, th { padding: 12px; }
- 上下左右分别控制：
td { padding: 8px 16px 12px 20px; }（顺序：上 → 右 → 下 → 左）
- 只调表头垂直间距：
th { padding-top: 10px; padding-bottom: 10px; }
- 某个单元格特殊处理：
<td style="padding: 20px 4px;">重点数据</td>
border-collapse: collapse 必须先设，否则 padding 行为不可控
默认
border-collapse: separate 下，
padding 和
border-spacing 会叠加影响视觉间距，容易导致行高突兀、打印错位或移动端文字贴边。真实项目中，90% 的“内边距看起来不对”问题都源于没显式声明这个。
- 正确写法：
table { border-collapse: collapse; }，再设 td, th { padding: ... }
- 如果用了
border-collapse: separate（比如要保留双边框），那 border-spacing 才生效，此时 padding 仅作用于单元格内部，和间距无关
- Outlook 邮件客户端不解析
<style> 块里的 td 样式，必须用内联：<td style="padding: 10px;">
响应式与单位选择：rem 和百分比的坑
padding 支持
rem、
%、
em 等现代单位，但行为和预期常有偏差：
-
padding 的百分比值始终相对于包含块宽度，不是父元素高度，也不是自身宽高
-
rem 会随根字体大小变化（比如用户缩放页面），若需绝对稳定，得锁定：html { font-size: 16px; }
-
td 在 display: table-cell 模拟场景下，padding 仍有效，但 vertical-align 会影响内容对齐，容易让文字“浮起来”或“沉下去”
真正在意的从来不是“怎么加”，而是加完之后谁在撑高表格
padding 本身不会触发行高计算异常，但一旦和
line-height、
min-height、
font-size 或
box-sizing 组合，就容易出问题：表头和数据行高度不一致、导出 PDF 时错行、iOS Safari 中文字被截断。动手前，打开开发者工具看一眼 computed styles 里的 actual
padding 和
height，比猜更可靠。
