使用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使用其inlinestyle属性对每个元素进行此操作，并且需要提供一个比所需的起始行号少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的原因，从而使最终用户（作者）更容易使用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>
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句