只写border-width没效果是因为border-style默认为none，必须同时设置border-style（如solid）和border-color（如#000），推荐简写为border: 2px solid #000；启用border-collapse: collapse是前提，否则边框不可控。
直接用 table 标签的 border 属性（比如 border="2"）无法可靠控制边框粗细——它在现代浏览器中已被废弃，且不支持颜色、样式或单边控制。
为什么只写 border-width 没反应？
常见现象是写了 td { border-width: 2px; }，但边框完全不显示。根本原因是：border-style 默认为 none，没有样式，宽度再大也无效。浏览器会直接忽略该声明。
- 必须同时设置
border-style（如solid、dashed）和border-color（哪怕只是#000） - 最稳妥写法是简写：
border: 2px solid #000，三者一次配齐，避免遗漏 - 调试时别只盯
border-top-width，去 Chrome DevTools 的 Computed 面板查border-top-style是否为solid - 某些重置样式（如
normalize.css）会把border-style设为hidden，比none更彻底——这时得显式覆盖：td { border-style: solid; }
border-collapse: collapse 是边框可控的前提
没加这句，所有边框粗细设置都会失效或不可预测。默认 border-collapse: separate 会让 table、th、td 各自渲染边框，导致视觉叠加、粗细翻倍甚至错位。
- 必须写在
table元素上：table { border-collapse: collapse; } - 启用后，相邻单元格边框合并，最终宽度取较大值（比如左单元格设
border-right-width: 2px，右单元格设border-left-width: 1px，交界处显示为 2px） - 此时
border-spacing失效，别混用 - 想让外框粗、内线细，不能只调
table的border，而要靠td和伪类组合“拼出”外轮廓
怎么实现外粗内细的表格边框？
统一加粗所有线很简单，但真正实用的是“外框醒目、内线轻量”的视觉层次。关键不是给 table 加粗边框，而是用单元格边界精准控制。
- 基础设定：
th, td { border: 1px solid #ddd; }（内线统一细） - 上外边框：
tr:first-child th, tr:first-child td { border-top: 2px solid #007BFF; } - 下外边框：
tr:last-child th, tr:last-child td { border-bottom: 2px solid #007BFF; } - 左外边框：
th:first-child, td:first-child { border-left: 2px solid #007BFF; } - 右外边框：
th:last-child, td:last-child { border-right: 2px solid #007BFF; } - 别漏掉
table { border: 2px solid #007BFF; }——否则右下角常断线，尤其有rowspan/colspan时
高 DPI 屏幕下边框变粗怎么办？
写死 2px 在 Retina 屏或 Windows 缩放 125% 下可能渲染为 4 物理像素，显得过重。这不是 bug，是设备像素比（DPR）导致的视觉失真。
- 小数像素（如
0.5px）在移动端 Safari 渲染不稳定，慎用 - 响应式场景可考虑
border: clamp(1.5px, 0.1vw, 2.5px) solid #000，但注意兼容性 - 更稳的替代方案：
box-shadow: 0 0 0 2px #000，它不受 DPR 影响，且能绕过部分浏览器对 sub-pixel 边框的舍入处理 - 打印样式建议用
pt单位（如border: 1.5pt solid #000），更符合物理尺寸预期
