rules属性仅在border-collapse:collapse时生效，否则被忽略；它不定义颜色线型，且无法精细控制单行/列样式，现代开发应优先使用CSS边框。

rules 属性确实能控制表格内部行列分隔线，但它不是“边框开关”，而是「仅在 border-collapse: collapse 模式下生效的内部分割线策略控制器」——不加这个 CSS，rules 会完全静默。

为什么写了 rules="all" 却看不到任何线？

根本原因几乎总是：border-collapse: collapse 缺失。浏览器默认用 separate 模式渲染表格，此时 rules 被忽略，无论设成 rows、cols 还是 all 都没反应。

• 必须显式给 <table> 加 CSS：style="border-collapse: collapse"
• rules 不会自动触发该模式，也不影响外边框
• 如果 <td> 自己有 border 样式，它会覆盖 rules 的线宽和颜色（rules 本身不定义颜色、线型或粗细）
• 嵌套表格中，每个 <table> 需单独设置 rules 和 border-collapse

rules 的取值行为与常见误读

rules 只接受固定字符串，不是布尔值或类名，且语义比直觉更窄：

• rules="none"：隐藏所有内部线（<tr> 之间、<td> 之间），但外框仍由 border 控制
• rules="rows"：只画水平线（即 <tr> 之间的分隔线），列方向无竖线
• rules="cols"：只画竖直线（同列相邻 <td> 之间），行方向无横线
• rules="all"：横竖线都画，但仍是「单像素网格」，前提是 border-collapse: collapse + 统一 border-width
• rules="groups"：仅在 <thead>/<tbody>/<tfoot> 边界处画线，需真实存在这些语义标签

注意：rules="rows" 不等于“只显示行边框”——它不控制 <th> 或 <td> 自身的四周边框，只决定行间那一条横线是否出现。

立即学习“前端免费学习笔记（深入）”；

Chrome/Safari 中 rules 显示异常的根本原因

这些浏览器会把 rules 解释为“内侧边框 + 外侧边框”，导致意外多出一圈外框，即使你只想要纯网格线。

• 例如 rules="rows" 在 Chrome 中可能同时渲染出顶部外框 + 行间横线 + 底部外框
• 这不是 bug，而是规范实现差异：HTML5 已明确不推荐使用 rules，浏览器保留兼容但未严格对齐旧 IE 行为
• 若需跨浏览器一致效果，必须额外用 CSS 清除外框：table { border: none; }，再单独给 <thead> 或 <tbody> 加边框
• ASP.NET Web Forms 中更麻烦：Table1.Rules = "all" 无效，必须写成 Table1.Attributes["rules"] = "all"

真正精细控制表格分隔线，rules 是个有历史包袱的快捷键，不是现代方案。它不支持颜色、虚线、圆角，也无法单独控制某一行/列。一旦需要差异化样式（比如表头下加粗线、最后一行不画线），就得切回 CSS 的 border-top/border-bottom 组合——这时候 rules 反而成了干扰源。