用border-spacing替代cellspacing是现代标准做法；cellspacing已废弃，因不支持响应式、无法区分水平/垂直间距、与border-collapse冲突且在html5中属非标准属性。
cellspacing 是 HTML <table> 标签的过时属性，用来设置单元格边框之间的距离。但它在现代开发中**不应再使用**——CSS 的 <code>border-spacing 才是正确替代方案，且行为更可控、可预测。
为什么 cellspacing 被废弃了
它属于 HTML 3.2/4.01 时代的内联表现控制，无法继承、无法用媒体查询响应、不支持单位（只能是像素值），更重要的是：它和 CSS 边框模型存在隐式冲突。
- 当
border-collapse: collapse生效时，cellspacing完全失效（浏览器会忽略） - 即使生效，它也无法区分水平/垂直间距（只能设一个值）
- 在 XHTML 或 HTML5 文档类型下，它属于“非标准属性”，部分校验器报错，某些框架（如 React）甚至会直接过滤掉
border-spacing 怎么用才不踩坑
这个 CSS 属性必须作用于 <table> 元素本身，且仅在 <code>border-collapse: separate（默认值）时有效。
- 写法：
border-spacing: 8px（水平+垂直都是 8px），或border-spacing: 12px 4px（水平 12px，垂直 4px） - 不能写成
border-spacing: 12px, 4px（逗号会直接失效） - 如果表格用了
border-collapse: collapse，先删掉这行，否则border-spacing永远不生效 - 注意：该属性不支持百分比、em、rem 等相对单位，只接受
px、em（部分浏览器支持）、rem（有限支持），最稳妥仍是px
表格行折叠效果跟 border-spacing 有关系吗
没有直接关系。border-spacing 控制的是静态渲染时单元格之间的空隙；而“行折叠”是通过 JavaScript 切换 tr 元素的 display 或 visibility 实现的动态行为。
- 常见错误：给折叠后的
tr加margin或试图靠border-spacing拉开父子行间距 —— 这会导致视觉错位或动画卡顿 - 真正需要协调的是：折叠后，
tr的height、opacity、max-height+overflow，以及父tbody的重绘边界 - 如果你发现折叠展开后单元格间距“跳变”，大概率是
border-collapse在 collapse/separate 之间被 JS 动态切换过，应统一锁定为separate并用border-spacing统一管理
实际项目里，cellspacing 基本只会在老系统迁移或遗留模板里见到；新代码中只要记住一点：所有间距控制都交给 CSS，且优先确认 border-collapse 的当前值。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
