html table的border属性仅具语义作用，不能控制边框粗细、颜色或样式；真正可控的边框必须用css配合border-collapse: collapse实现。
HTML border 属性不能控制线条粗细显示
直接写 border="2" 或 border="5" 不会让边框变粗——浏览器会忽略这些值，或仅在极少数旧 UA 中触发不可预测的默认渲染。HTML5 规范已将 border 属性降级为语义标记（表示“这是数据表”），而非样式控制手段。它不支持颜色、线型、粗细定制，也不影响 <th> 和 <code><td> 的内边框。
<h3>
<code>border-collapse: collapse 是单线边框的前提
没它，你看到的“双线”不是 bug，而是浏览器默认用 border-spacing: 2px + border-collapse: separate 导致相邻单元格边框独立绘制、中间留缝。即使给 table、th、td 都设了 border: 1px solid #000，也会出现视觉上加粗、错位、断续等问题。
-
border-collapse: collapse必须写在table元素上，对th或td单独声明无效 - 合并后，交界处边框按“宽者胜出”规则取舍：若
table { border: 2px }但td { border: 1px }，交界仍显示 2px - 别忘了同时设
border-spacing: 0（虽然collapse下它被忽略，但显式声明可防误配）
CSS border 才是真正可控的边框方案
要精确控制粗细、颜色、样式，必须用 CSS 分别设置 table、th、td 的 border，并搭配 border-collapse：
table {
border: 2px solid #333;
border-collapse: collapse;
}
th, td {
border: 1px solid #ccc;
padding: 8px;
}
- 外框和内框可不同粗细，但交界处不会叠加，只取最大值
- 想只保留外框？删掉
th, td { border: ... }，但注意此时内部无分隔线 - 响应式下容易塌缩：务必加
table { min-width: fit-content }或width: 100%防文字挤压
为什么 border="0" 不等于“无边框”
border="0" 是非法值，浏览器静默丢弃，等效于未设置该属性——它既不移除 UA 默认边框，也不禁用 border-collapse。真要清空边框，得靠 CSS：
- 全部清除：
table, th, td { border: none; border-collapse: collapse; } - 只清内框留外框：
th, td { border: none; }，再单独设table { border: 1px solid #000; } - 注意：仅设
border: 0（数值 0）可能被某些 UA 解释为“默认宽度”，应始终用none或0 solid transparent
border-collapse: collapse 这一行——它藏在所有“边框看起来怪怪的”问题背后，且不报错、不警告，只默默让布局失控。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
