border-collapse仅控制表格相邻边框是否合并，不管理padding、margin或尺寸计算；其作用限于separate（独立边框）与collapse（合并为单线）两种模式，且collapse下border-spacing和empty-cells失效。
border-collapse 不是用来“管理盒模型”的，它是专门控制表格边框绘制方式的开关。想靠它解决 padding、margin 或尺寸计算问题，会越调越乱。
border-collapse 只管相邻边框是否合并
它的作用非常窄：决定两个 td 或 th 的 border 是各自独立（separate），还是“挤在一起”合成一条线（collapse）。它不碰 padding，不碰 margin，也不影响盒子尺寸计算逻辑。
-
border-collapse: separate（默认）→ 每个单元格有自己完整的 border，相邻边框之间留空（由border-spacing控制） -
border-collapse: collapse→ 相邻单元格的 border 合并为一条，border-spacing和empty-cells失效 - 设了
collapse之后再改border-spacing，浏览器直接忽略——这不是 bug，是规范行为
为什么加了 border-collapse: collapse 表格还是“松”或“挤”
因为视觉松紧感根本不是 border-collapse 决定的，而是三个东西叠加的结果：
-
border-spacing：只在separate下起作用，控制单元格之间的物理空隙 -
padding：作用于td/th，控制内容离单元格边框的距离，collapse和separate下都有效 - 子元素的
margin：比如td > p默认有上下 margin，会撑开padding区域，看起来像“额外间隙”
检查开发者工具时，要分清高亮的是 padding 区，还是子元素的 margin 区——调错地方就白忙活。
立即学习“前端免费学习笔记（深入）”；
实际调试时该先动哪个属性
按优先级顺序排查：
- 先确认
table上有没有显式设置border-collapse；没设就按默认separate理解布局 - 如果是
separate模式，想调单元格间距 → 改border-spacing，别碰padding - 如果是
collapse模式，想让文字离边框远点 → 改td { padding: 12px; }，别去碰border-spacing - 发现单元格高度莫名变大 → 检查
td里有没有p、h3这类自带 margin 的元素，加td > * { margin: 0; }
真正难处理的，从来不是单个属性值，而是 border-collapse 切换后，border-spacing、padding、子元素 margin 三者谁生效、谁失效、谁还在悄悄撑开空间——必须同时看，不能只盯一个。
