border-collapse: collapse 是解决表格边框双线、加粗、缝隙问题的唯一可靠方法；它必须作用于 table 元素，合并相邻边框，废除 border-spacing，并按宽度>样式>声明顺序规则决定最终边框样式。
border-collapse: collapse 是唯一靠谱解法
表格边框看着像双线、加粗、有缝隙，不是你 border 写错了，是浏览器默认用 border-collapse: separate 渲染的。每个 td 和 th 都画自己的边框，相邻单元格的边框就叠在一起，视觉上变粗或发虚——这不是 bug，是规范行为。
必须显式设置 table 元素的 border-collapse: collapse，才能让相邻边框合并成一条线。这个属性只作用于 table，写在 td 或 div 上无效。
- 必须写在
table标签的 CSS 规则里，不能只写在td上 - 一旦启用
collapse，border-spacing会被忽略，别再设它 - 边框宽度取相邻单元格中的最大值，比如左单元格
border-right: 2px，右单元格border-left: 1px，最终显示为 2px - 颜色和样式也按“覆盖规则”处理：同宽时，后声明的样式（CSS 层叠顺序）生效；不同宽时，宽的优先
别混用 HTML 的 border 属性和 CSS 边框
写 <table border="1"> 再加 CSS 里给 <code>td 设 border，等于主动制造重叠。HTML border 属性本质是给整个表格加外边框 + 每个单元格加内边框，和 CSS 的 border 不是同一套逻辑。
现代项目一律禁用 border 属性。全部用 CSS 控制：
- 删掉所有
border="..."、cellspacing、cellpadding这类 HTML 属性 - 统一用
table+td+th的 CSSborder声明 - 如果只要外边框，就只给
table设border，td不设；如果要格子线，就只给td和th设，table不设
嵌套表格时边框会再次重叠
一个 td 里再放 table，新表格默认又是 separate 模式，它的边框会和父级 td 的边框叠加，导致局部区域边框异常加粗。
解决方法很简单：嵌套的 table 也要单独加 border-collapse: collapse。不能指望父级样式继承过去，CSS 的 border-collapse 不继承。
- 嵌套表格必须独立设置
border-collapse - 如果嵌套表不需要格子线，直接给它的
td设border: none，比调border-collapse更干脆 - 避免在
td里用padding模拟边框，容易和真实边框冲突
table-layout: fixed 会影响边框渲染表现
当表格列数多、内容长度不均，又用了 table-layout: fixed，浏览器会强行按 width 分配列宽，可能导致某些 td 的边框被截断或错位，看起来像边框“消失”或“偏移”。
这不是 border-collapse 失效，而是盒模型计算异常。临时调试时可先注释掉 table-layout: fixed 看是否恢复——如果恢复了，说明问题出在列宽分配逻辑，而非边框本身。
-
table-layout: fixed和border-collapse: collapse可共存，但前者会改变单元格尺寸计算方式 - 配合使用时，务必给
table或每列col明确设width，否则边框位置可能浮动 - 移动端小屏下，
fixed容易引发文字溢出撑破边框，此时建议改用auto并靠word-break: break-word控制换行
border-collapse: collapse，而是它不生效时——往往因为 selector 优先级被覆盖、嵌套层级漏设、或者混用了过时的 HTML 属性。遇到不生效，第一反应不该是换写法，而是打开开发者工具，盯住 computed 样式里的 border-collapse 值是不是真的 applied。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
