border-spacing没反应最常见原因是border-collapse被设为collapse，此时该属性被浏览器强制忽略；必须显式设置border-collapse: separate并作用于table元素，且需检查computed styles确认实际值。
border-spacing 为什么写了没反应
最常见原因是 border-collapse 被设成了 collapse。这个值一出现，border-spacing 就彻底失效——浏览器连解析都跳过，DevTools 里可能直接标为“无效”。
必须显式写 border-collapse: separate，哪怕你没动过它，也别假设它是默认值：第三方库（如 Bootstrap 4+ 的 .table）、CSS 重置、甚至某个全局 table { border-collapse: collapse; } 都可能悄悄覆盖。
- 检查 computed styles 中
border-collapse是否真为separate，不要只看源码有没有写 -
border-spacing只能写在<table>元素上，写在<td>或<tr>上完全无效 - IE8 及更早版本不支持，但现代项目基本不用考虑；若需兼容 IE7，只能退用废弃的
cellspacing属性
border-spacing 的两个值谁管横谁管竖
顺序固定：第一个值是水平间距（列与列之间），第二个是垂直间距（行与行之间），和 margin 或 padding 的四值顺序无关。
-
border-spacing: 6px→ 列距 6px，行距也是 6px -
border-spacing: 4px 12px→ 列距 4px，行距 12px（不是“上下 4px，左右 12px”） - 单位只支持
px、rem、vw等绝对或视口单位；%、em、负值均被忽略
和 padding、margin 混用时视觉错乱怎么办
border-spacing 控制的是「单元格边框外侧」的纯透明间隙，而 padding 是内容到单元格边框的距离，margin 对 <td> 和 <th> 完全无效。
立即学习“前端免费学习笔记（深入）”；
- 想让文字离边框远点 → 改
padding（作用于<td>） - 想让两列之间宽一点 → 改
border-spacing（作用于<table>） - 给
<td>加margin不起作用，别白试 - 用了
colspan或rowspan时，border-spacing仍生效，但跨格单元格右侧/下方的间隙位置可能偏移，需肉眼校验
当 border-collapse: collapse 必须保留时怎么模拟间隙
如果无法改 border-collapse（比如依赖某框架的边框合并逻辑），就放弃物理间隙，转为视觉模拟：
- 给
<td>加padding，再配细边框如border: 1px solid transparent，制造空隙感 - 用
outline替代border，因为outline不占布局空间，配合padding更易控距 - Flex/Grid 布局下根本不能用
border-spacing——它只属于表格渲染上下文；此时请用gap、row-gap、column-gap
真正麻烦的不是怎么写，而是查哪行 CSS 把 border-collapse 给悄悄改成了 collapse——这种隐式覆盖最容易漏掉，且优先级常高于你本地写的 border-spacing。
