内嵌表格的间距必须单独为每个设置border-collapse和border-spacing，因外层border-spacing仅作用于其直接子，对作为内容的内嵌表格无效；其border-spacing默认为0，需显式声明才生效。
内嵌表格的间距不能靠外层 浏览器只对直接子级 必须显式为每个内嵌 内嵌表格的 真正麻烦的点不在嵌套本身，而在于你很难一眼看出哪一层表格被哪个 CSS 规则覆盖了——尤其是当项目用了 UI 库又没禁用其 table 样式时。 使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。border-spacing 控制，必须单独处理每一层 <table> 的 <code>border-collapse 和 border-spacing。
为什么外层
border-spacing 对内嵌表格无效<tr> 应用外层 <code>table 的 border-spacing；内嵌表格是 <td> 的内容，完全脱离外层表格的网格结构。即使外层设了 <code>border-spacing: 12px，内嵌表格的单元格之间仍按它自己的 border-collapse 状态和 border-spacing 计算。
border-collapse: separate（若未被重置），但它的 border-spacing 值仍是初始值 0，不是外层的值table 写 border-spacing: 8px 就以为所有子表格都“带上了”，结果内嵌部分密不透风<table> 的 <code>border-spacing，大概率显示 0px —— 这就是问题根源
怎么给内嵌表格单独设间距
<table> 设置样式，且优先级要高于全局重置（比如 Ant Design 或 Normalize.css 可能已设 <code>table { border-collapse: collapse; }）。
<table style="border-collapse: separate; border-spacing: 6px;"><li>推荐类名控制：<code><table class="nested-table"> + CSS：<code>.nested-table { border-collapse: separate; border-spacing: 4px 8px; }（列距 4px，行距 8px）
border-collapse: collapse，此时 border-spacing 自动失效，靠 td, th { padding: 4px 8px; } 控制呼吸感cellspacing 属性——它在内嵌场景下行为更不可控，且 HTML5 已废弃嵌套时表头与内容间隙怎么调
<thead> 和第一行 <code><tbody> 之间的空隙，由它自身的 <code>border-spacing 第二个值决定，和外层无关。
<table> 上设 <code>border-spacing: 0 10px → 列无缝、<thead> 与首行内容垂直留 10px
<li>错误做法：给外层 <code>th 加 padding-bottom 或给内嵌 td 加 padding-top，这只会推内容，不改变物理位置，反而导致边框断裂或文字悬浮<thead>，只有普通 <code><tr>，那“表头与内容间隙”就不存在，此时行距由相邻 <code><tr> 间的 <code>border-spacing 垂直值统一控制
border-collapse: collapse 很可能在某个全局文件里悄悄生效，让所有内嵌表格的 border-spacing 彻底静默。调试时务必逐层检查 Computed 面板里的 border-collapse 和 border-spacing 实际值，而不是只看 Styles 面板里写了什么。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
