Question

计数器没有继续编号，我希望第二个li（定义）的编号为2，但是它将继续嵌套ol的编号，因此它的编号为1.2，而不是2：

  list--sub-decimal {
    counter-reset: decimal;
    > li:before {
      counter-increment: decimal;
      content: counters(decimal, ".", decimal) " ";
    }
  }

  <ol class="list--none">
    <li>
      <ol class="list--sub-decimal">
        <li class="subItem"><strong>DEFINITIONS</strong></li>
          <ol class="list--sub-decimal">
           <li class="subItem"><strong>"Agreement"</strong> blaa</li>
          </ol>
        <li class="subItem"><strong>DEFINITIONS</strong></li>
      </ol>
     </li>
   </ol>

谢谢！

Answer 1

您需要先编写有效的HTML才能使此类工作正常工作。

您的第二个<ol class="list--sub-decimal">未正确包装在li内，但是是其上方ol的子代-不允许。

修复该问题后，它会起作用：

.list--sub-decimal {
  counter-reset: decimal;
 }
 .list--sub-decimal > li:before {
    counter-increment: decimal;
    content: counters(decimal, ".", decimal) " ";
 }

<ol class="list--none">
  <li>
    <ol class="list--sub-decimal">
      <li class="subItem"><strong>DEFINITIONS</strong>
        <ol class="list--sub-decimal">
          <li class="subItem"><strong>"Agreement"</strong> blaa</li>
        </ol>
      </li>
      <li class="subItem"><strong>DEFINITIONS</strong></li>
    </ol>
  </li>
</ol>

我如何让CSS计数器继续

1 个答案: