border-collapse: collapse必须写在table元素上才生效，写在td、tr或外层div上均无效；它仅作用于表格级布局，启用后按宽>样式>声明顺序规则合并相邻边框。
border-collapse: collapse 必须写在 table 元素上才生效
很多人把 border-collapse: collapse 加到 td、tr 或外层 div 上，结果完全没反应——这是最常见失效原因。该属性是表格级样式，只对 table 元素本身起作用。
实操建议：
- 直接给
table标签加内联样式：<table style="border-collapse: collapse"> - 或在 CSS 中明确写：
table { border-collapse: collapse; }，不要写成tr { border-collapse: collapse; } - 若项目用了 UI 框架（如 Ant Design、Bootstrap），检查是否被其重置样式覆盖，可加
!important临时验证，但长期应提高选择器权重
合并后边框“消失”或“粗细不一”，其实是边框冲突规则在起作用
border-collapse: collapse 不是简单“叠加变细”，而是让相邻边框按优先级“竞争胜出”：宽度 > 样式（solid > dashed） > 声明顺序（后定义的覆盖先定义的）。所以你看到的边框，未必是你以为那个元素设的。
常见现象与对策：
立即学习“前端免费学习笔记（深入）”；
-
th设了2px solid red，td是1px solid #999，但横向线却显示为1px——因为td的上边框和th的下边框重叠，而td的声明在 CSS 中靠后，且宽度更小，但样式/颜色未占优，最终取了td的边框 - 想确保表头线显眼？统一在
th和td上设相同宽度和样式，例如：th, td { border: 1px solid #ccc; } - 要强制某一边框生效（比如首行底边必须是
2px），直接用单边属性：th:first-child { border-bottom: 2px solid #333; }，并确保它的选择器权重足够
为什么加了 collapse 还有间隙？检查 border-spacing 和 display: block
border-collapse: collapse 和 border-spacing 是互斥开关。只要用了后者，前者就自动降级为 separate；同样，设了 collapse 后，border-spacing 的值会被浏览器静默忽略。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
另外，如果给 table 设置了 display: block（比如为了 flex 布局兼容），border-collapse 就会失效——现代浏览器中，该属性仅在 display: table 及其变体（table-cell 等）下有效。
排查步骤：
- 在开发者工具中检查
table元素的 computed 样式，确认border-collapse确实是collapse，且没有被其他规则覆盖 - 搜索整个 CSS，删掉所有
border-spacing相关声明 - 避免对
table使用display: block、inline-block等非表格 display 值；如需控制宽高或居中，改用width、margin等属性
要“只有内线、无外框”，不能靠 border-spacing: 0
有人试过 border-collapse: collapse; border-spacing: 0;，结果外框还在——因为 border-spacing 在 collapse 模式下根本无效。真要隐藏外边框，得靠“主动清空”。
做法很直接：
- 先确保
table自身无边框：table { border: none; }或table { border: 1px solid transparent; } - 再靠
td和th的边框撑出内线：td, th { border: 1px solid #ddd; } - 此时首行、末行、首列、末列会多出半条线，用伪类微调：
tr:first-child th, tr:first-child td { border-top: none; }、td:last-child, th:last-child { border-right: none; }
这个组合看似多一步，但它是唯一稳定可控的方式。别指望 collapse 自动帮你“智能裁边”——它只管合并，不管显隐。
