Html CSS编号问题混合编号

因此，我有以下HTML中的标题示例，比如class=roman>H1

另一个例子是

1. H1
   a) H2
   b) H2
2. H1
   2.1 H2
   2.2 H2

我使用CSS自动编号，第二个例子很好，第一个例子的结果是

I. H1
   a) H2
   b) H2
II. H1
   0.1 H2
   0.2 H2

问题在于H2计数的前导0。这是因为CSS计数器仍然是0，我使用的CSS计数器如下

h2.num:before {
     content: counter(H1) "." counter(H2) " ";
     counter-increment: H2;
}

及

如果计数器值为0，有没有办法省略它，或者有没有其他办法

---

这是一个最小的例子，即使增量也不起作用，前导零也是一个问题。这里出了什么问题？

当0不能从CSS中执行时不显示，可能从javascript中过滤掉

但这应该不难解决。尝试将主计数器的计数器增量和辅助计数器的计数器重置为1直接应用于H1标记，然后将辅助计数器的计数器增量应用于h2标记

body {
    counter-reset: section;
}

h1 {
    counter-increment: section;
    counter-reset: subsection;
}

h1::before {
    content: counter(section) ". ";
}

h2::before {
    counter-increment: subsection;
    content: counter(section) "." counter(subsection) " ";
}

---

你能展示一个发生这种情况的场景吗？就你的例子来说，不清楚为什么你不使用content:counterH2而不包括一个从不增加的计数器。看上面的更改这就是你想要的：Thanx danield解决了我问题的第一部分…@重新编码你自己的小提琴中的问题是你试图维护四个不同的计数器，但是由于没有类num的h1，计数器部分从不递增。此外，您可以重置正文中的section2，但不重置section。您应该已经编写了正文{计数器重置：第2节；}

h1.al:before {
     content: counter(H1LR, lower-latin) ") ";  
     counter-increment: H1LR; 
}

body {
    counter-reset: section;
}

h1 {
    counter-increment: section;
    counter-reset: subsection;
}

h1::before {
    content: counter(section) ". ";
}

h2::before {
    counter-increment: subsection;
    content: counter(section) "." counter(subsection) " ";
}