HTML5 中 table 的 border 属性仅具语义作用，无法可靠控制边框样式；应使用 CSS 的 border-collapse、table 和 th/td 的 border 三者组合实现可控边框。

Html2md

使用 Readability + Turndown 将 HTML 页面转换为干净的、Agent 友好的 Markdown。去除导航栏、广告、页脚、Cookie 横幅、社交按钮等干扰元素。支持 URL...

下载

HTML <table> 的 <code>border 属性不能可靠控制边框显示效果，现代开发中应完全弃用它来实现视觉边框。 它在 HTML5 中仅保留语义含义（"1" 表示数据表，"" 或省略表示布局用途），浏览器不再按你写的像素值渲染粗细，也不会响应颜色或样式设置。

为什么 border="1" 有时有边框、有时没有

这不是 bug，而是规范行为：HTML5 下 border="1" 仅触发浏览器“默认数据表样式”，而该样式由 UA（用户代理，即浏览器）自行决定——Chrome 可能画 1px 灰色实线，Firefox 可能只画外框、内框断开，Safari 可能干脆不画内边框。更关键的是，它默认启用 border-collapse: separate + border-spacing: 2px，导致单元格之间出现白缝，看起来像“边框消失”或“错位”。

• border="0" 在 HTML5 中非法，被忽略，退化为 border="" 行为（无语义、无边框）
• border="2"、border="8" 等数值属于无效值，浏览器静默丢弃，不报错也不生效
• 即使旧版 HTML4 支持像素值，各浏览器对“内边框是否随 border 缩放”的实现也完全不一致

用 CSS 实现真正可控的表格整体边框

必须组合使用三个 CSS 规则，缺一不可：

• table { border-collapse: collapse; } —— 强制合并所有相邻边框，消除间隙
• table { border: 1px solid #333; } —— 控制表格最外层边框（粗细、颜色、线型）
• th, td { border: 1px solid #333; } —— 控制每个单元格的边框；若只设 table 而不设 th/td，内部将无边框

示例：

table {
  border-collapse: collapse;
  border: 2px dashed #007BFF;
}
th, td {
  border: 1px solid #dee2e6;
  padding: 8px;
}

注意：th 和 td 的边框会与 table 外边框在角点处交汇，若三者宽度/颜色不一致，浏览器按“胜出规则”取舍（比如粗边框覆盖细边框），不会叠加。

哪些场景下仍可能看到 border 属性生效

仅限于两类遗留环境，且效果不可控：

• 老 ASP.NET Web Forms 项目中，HtmlTable.Border = 2 会生成 <table border="2">，但最终渲染仍受 HTML5 规范限制；若同时设了 <code>style="border: 1px solid red"，后者一定覆盖前者
• 极简静态页快速验证时，<table border="1"> 可能“碰巧”显示一条灰线，但无法保证跨浏览器一致，也不能改颜色、加圆角、设虚线 <p>真正需要统一粗细、指定颜色、支持响应式或悬停变色的边框，<code>border 属性连起点都达不到——它不是快捷方式，是过期接口。

  最容易被忽略的一点：很多人给 table 加了 border 就以为完事了，却忘了 th 和 td 必须显式声明边框，否则内部永远是空的；更隐蔽的是，<thead> 或 <code><tbody> 上误加 <code>border 样式，会意外覆盖掉 th/td 的边框，造成局部缺失。