CSS计数器重置，没有指定任何计数器重置属性

Question

I made a quick mock-up of the problem at hand。 （more compact version to avoid possible confusion）它的基本布局与我正在使用的文件相同;它只缺少大部分造型。

基本上我试图完成以下任务：

• 每个<p>元素都应由一个数字处理，每个新段落自动增加1。
• 在每个<h4>元素（大号绿色数字）中，此计数器（名为 vers ）应重置为1.
• 在<p>之后立即放置<h4>元素并不显示其计数器编号。现在查看我的页面，您已经看到了问题：
• 计数器在每个<h4>元素（蓝色）处重置，而不是一直递增直到达到<h3>，尽管没有指定计数器重置。
• 我无法弄清楚如何防止 vers 计数器在错误的位置跳回到1。

现在抓住这个问题了：它曾经正常运作。

之前我在每个段落的开头都有一个空的<var>元素，并用它来显示计数器值，因为它更容易设置样式。

然而事实证明这很乏味，所以我直接将计数器切换到段落。这就是它开始做这个奇怪的事情，而不是正确计数。

我的所有操作都是在样式表中将var::before更改为p::before，并从文档中删除所有<var>元素。定义的计数器属性没有改变一位。

我希望有一种方法可以让这件事工作而不会再回到再次使用<var>。