不能。counter-set 是 css 计数器偏移设置指令，不重置行号；真正实现每 tbody 从 1 编号需靠 counter-reset（在 tbody 上初始化）、counter-increment（在 tr 上递增）和 ::before（显示值）三者配合。
counter-set 能不能直接重置表格行号
不能。counter-set 是 CSS 计数器控制指令，但它本身不生成内容、不绑定 DOM 结构，更不会自动关联 <tr> 元素。表格行号这类“按行递增”需求，本质是「对每个 <code><tr> 应用计数器递增 + 显示」，而重置动作必须发生在某个容器的起始位置（比如新 <code><tbody>），靠的是 <code>counter-reset，不是 counter-set。
真正起作用的是 counter-reset + counter-increment + ::before
要实现“每 tbody 从 1 开始编号”，核心是三层配合：counter-reset 在 <tbody> 上初始化计数器，<code>counter-increment 在 <tr> 上每次加 1，再用 <code>::before 把值插进去。常见错误是把 counter-set 写在 <tr> 上想“手动设为 1”，这只会让所有行都显示 1，且破坏递增逻辑。
<p>正确写法示例：</p>
<pre class="brush:php;toolbar:false;">tbody {
counter-reset: rownum;
}
tbody tr {
counter-increment: rownum;
}
tbody tr::before {
content: counter(rownum) ". ";
margin-right: 0.5em;
color: #666;
}</pre>
<p>注意：<code>counter-reset: rownum 放在 tbody 上，就确保每个 <tbody> 都独立从 1 计数；如果放在 <code>table 上，则全表连续编号。
为什么有人误用 counter-set？
因为 MDN 文档里提到 counter-set 可以“显式设置计数器值”，但它的典型使用场景极窄：比如需要跳过某些编号（第 5 行显示 “8”），或在嵌套结构中同步多个计数器。表格行号几乎不需要它。容易踩的坑包括：
- 在
<tr> 上写 <code>counter-set: rownum 1—— 每行都重设为 1，counter-increment还会立刻+1，结果全显示 “2” - 把
counter-set和counter-reset混用在同一作用域 —— 后者优先级更高，前者被忽略 - 期望
counter-set触发重新渲染 —— 它不触发 layout/reflow，纯 CSS 值变更，无法替代 JS 逻辑
复杂点：跨 tbody 续编 or 分段重置？
如果真需要“第一 tbody 从 1 到 5，第二 tbody 从 6 开始”，就不能依赖 counter-reset，得用 JS 手动 setAttribute 或用 counter-set 配合伪元素动态注入。但此时已脱离纯 CSS 表格编号范畴，属于数据驱动渲染——这时候该考虑用 data-row-index 属性 + JS 控制，而不是硬拗 CSS 计数器。
纯 CSS 下，counter-reset 是分段重置的唯一可靠方式；counter-set 不是“重置行号”的工具，它是“微调偏移量”的备用开关，用错地方反而让编号错乱。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
