css 计数器重置:在 Firefox 中不起作用?

An *_*ver 5 html css firefox css-counter

Firefox 桌面 v84 更新是否破坏了 CSS 计数器重置:功能?Chrome 和 Edge 渲染正常,但 Firefox 不行 有人能确认吗?

下面是我正在使用的代码示例:

body
{
counter-reset: section subsection;
}
p.section
{
  counter-reset: subsection;
}
p.section:before
{
  counter-increment: section;
  content: "" counter(section) ".0" ": ";
  counter-reset: subsection;
}
p.subsection:before
{
  counter-increment: subsection;
  content: "" counter(section) "." counter(subsection) ": ";
}
Run Code Online (Sandbox Code Playgroud)
<p class="section">Paragraph should be 1.0</p>
<p class="section">Paragraph should be 2.0</p>
<p class="subsection">Paragraph should be 2.1</p>
<p class="subsection">Paragraph should be 2.2</p>
<p class="section">Paragraph should be 3.0</p>
<p class="section">Paragraph should be 4.0</p>
<p class="subsection">Paragraph should be 4.1</p>
Run Code Online (Sandbox Code Playgroud)

Yud*_*ons 0

您能检查一下下面的代码吗?希望它对你有用。不需要重置中的小节body,因为我们需要在每次之后重置计数器section。所以我们将计数器重置部分保留原样section

请参考此链接https://jsfiddle.net/yudizsolutions/baqnzf39/6/

<html>

<head>
  <style type="text/css">
    body {
      counter-reset: section;
    }

    p.section {
      counter-reset: subsection;
    }

    p.section:before {
      counter-increment: section;
      content: ""counter(section) ".0"": ";
      counter-reset: subsection;
    }

    p.subsection:before {
      counter-increment: subsection;
      content: ""counter(section) "."counter(subsection) ": ";
    }
  </style>
</head>

<body>
  <p class="section">Paragraph should be 1.0</p>
  <p class="section">Paragraph should be 2.0</p>
  <p class="subsection">Paragraph should be 2.1</p>
  <p class="subsection">Paragraph should be 2.2</p>
  <p class="section">Paragraph should be 3.0</p>
  <p class="section">Paragraph should be 4.0</p>
  <p class="subsection">Paragraph should be 4.1</p>
</body>

</html>
Run Code Online (Sandbox Code Playgroud)