使用 CSS 计数器，是否可以设置一个在 :before 中显示计数器的类，但每次使用该类时都设置该计数器的初始值？
例如，如果我使用下面的 css 和 html 显示行号，我是否可以创建一个类，允许我说从 7 而不是 1 开始行号，或者，我是否必须为每个块创建一个唯一的类我想从不同的初始计数器值开始？
pre { counter-reset: line; }
code{ counter-increment: line; }
code:before{ content: counter(line); }
<pre><code>Line of code</code></pre>
您可以为 提供任意起始值counter-reset，但您需要pre使用其 inline 属性对每个元素执行此操作style，并且您需要提供比所需起始行号小 1 的数字：
pre { counter-reset: line; }
code { counter-increment: line; }
code::before { content: counter(line); float: left; margin: 0 1ch; }<pre style="counter-reset: line 6"><code>Line of code</code></pre>正如您可以想象的那样，这是非常骇人听闻的（我不是指您在这里对行号的实现，因为它不是您问题的重点，我的陈述适用于任何使用 CSS 计数器的实现，无论多么强大），但是没有其他纯 CSS 解决方案（您甚至可以考虑使用“非纯 CSS”的内联样式，这是完全可以理解的）。这就是为什么大多数实现都以某种形式或形式使用 JavaScript 以使最终用户（作者）更容易使用它。
如果只有浏览器支持attr()除 之外的属性content，这将变得完全微不足道，但可惜它们不支持，因此以下假设的解决方案不起作用：
pre { counter-reset: line; }
pre[data-line] { counter-reset: line calc(attr(data-line integer) - 1); }
code { counter-increment: line; }
code::before { content: counter(line); float: left; margin: 0 1ch; }
<pre data-line="7"><code>Line of code</code></pre>