table直接加border属性不生效是因为HTML5中该属性已过时且默认为0，且默认采用分离边框模型导致边框重叠不统一；需用CSS的border-collapse: collapse合并边框，并为table、th、td均设置border。
table 元素直接加 border 属性不生效？原因在这里
HTML5 中 <table> 的 <code>border 属性虽仍被浏览器支持，但属于过时用法（obsolete），且默认值为 0，不写就等于没边框。更关键的是：即使写了 border="1"，实际渲染出的边框是「分离边框模型」（separate borders），单元格之间会有双倍间距、边框重叠不统一，根本不是你想要的「整齐实线边框」。
用 border-collapse: collapse 才算真正控制表格边框
这是让表格边框变成干净实线的核心 CSS 规则。它强制把相邻单元格的边框合并成一条线，否则 border 再多也看着毛糙。
- 必须同时给
<table> 设置 <code>border（比如1px solid #000）和border-collapse: collapse <th> 和 <code><td> 也要单独设 <code>border，否则内部线会缺失- 别漏掉
border-spacing: 0（虽然collapse下它自动失效，但显式写上更稳妥）
<table style="border: 1px solid #333; border-collapse: collapse;">
<tr>
<th style="border: 1px solid #333;">姓名</th>
<th style="border: 1px solid #333;">年龄</th>
</tr>
<tr>
<td style="border: 1px solid #333;">张三</td>
<td style="border: 1px solid #333;">25</td>
</tr>
</table>
想一劳永逸？用 class 统一控制比内联样式靠谱
每次手敲 style 太累，还容易漏掉某个 <td>。定义一个 class 更安全，也方便后续改颜色/粗细。
<ul><li>给 <code><table> 加 class，比如 <code>class="table-solid"
.table-solid th, .table-solid td
table tr td 这种宽泛选择器，可能误伤嵌套表格.table-solid {
border: 1px solid #ccc;
border-collapse: collapse;
}
.table-solid th,
.table-solid td {
border: 1px solid #ccc;
padding: 8px;
}
border-style 选错导致「实线」变虚线？检查这三点
明明写了 border: 1px #000 solid，却看到点线或双线——大概率是继承了别的样式或拼写错误。
立即学习“前端免费学习笔记（深入）”；
-
solid是唯一表示「连续实线」的关键字，dashed、dotted、double都不行 - 检查是否被更高优先级的规则覆盖（比如某处写了
border-style: none） - 某些重置 CSS（如 normalize.css）会默认清空表格边框，得手动补回来
最简验证法：临时加 !important 测试，如果此时变实线，说明被覆盖了。
