border-style: double 在表格中无效是因为默认 border-collapse: separate 导致单元格边框独立绘制、无法对齐；必须先设 table { border-collapse: collapse; }，再统一为 th, td { border: 3px double #000; }（宽度需≥3px才能正确渲染双线）。

table加border-style: double为什么没效果？

直接给

写border-style: double只影响外边框，内部单元格之间仍是默认分隔线，看起来像“单线+杂乱细线”，不是整体双线效果。根本原因是浏览器默认用border-collapse: separate，每个<td>的边框独立绘制，双线无法对齐。 <h3>必须同时设置border-collapse: collapse</h3> <p>这是关键前提，否则<code>double在<td>上会错位、重叠或显示异常。实际生效路径是： <ul> <li>先设<code>table { border-collapse: collapse; }

再给<td>和<code><th>分别加<code>border: 3px double #000（宽度不能低于2px，建议≥3px）

不要只给table加border——那只是外框，内部格线不会变

为什么border-width必须≥3px？

border-style: double的规范定义是：两条等宽实线 + 中间等宽空白，总宽度 = 3 × 单线宽度。若设border-width: 1px，浏览器可能直接降级为单线渲染；2px在部分旧引擎中也不稳定。实测可靠下限是3px，例如：

Wechat HTML Publisher

直接上传HTML富文本到微信公众号草稿箱。支持完整的HTML格式,无需Markdown转换。

下载

A

B

IE8及更早版本不支持double，但现代项目基本不用考虑

如果你的项目仍需兼容 IE8，double会退化为solid，且无警告。这不是 bug，是标准行为。2026 年绝大多数生产环境已移除 IE8 支持，不必为此增加 hack 代码。真正容易被忽略的是：一旦用了border-radius，double会在圆角处断裂，这个限制没有 fallback，只能换方案——比如用box-shadow模拟外线 + border画内线。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！