有序列表没有正确递增

Question

在此有序列表中，我尝试使用十进制数字，但由于某种原因，它没有按预期编号。为了确定B和B部分的编号，需要做些什么。 C并实现以下目标？：

2）B

2.1）B1

2.2）B2

2.3）B3

3）C

＆＃13;

＆＃13;

ol {
	counter-reset: item;
	list-style-type: decimal;
}
li {
	display: block;
}
li:before {
content: counters(item, ".") ") "; counter-increment: item
}
<!-- begin snippet: js hide: false console: true babel: false -->

＆＃13;

<ol>
  <li><a>A</a>
  </li>
  <ol>
    <li><a>A1</a>
    </li>
    <li><a>A2</a>
    </li>
    <li><a>A3</a>
    </li>
    <li><a>A4</a>
    </li>
  </ol>
  <li><a>B</a></li>
  <ol>
    <li><a>B1</a>
    </li>
    <li><a>B2</a>
    </li>
    <li><a>B3</a>
    </li>
  </ol>
  <li><a>C</a>
  </li>
</ol>

＆＃13;

＆＃13;

＆＃13;

content: counters(item, ".") ". "; counter-increment: item
}

      <ol>
        <li><a>A</a></li>
        <ol>
          <li><a>A1</a></li>
          <li><a>A2</a></li>
          <li><a>A3</a></li>
          <li><a>A4</a></li>
        </ol>
        <li><a>B</a></li>
        <ol>
          <li><a>B1</a></li>
          <li><a>B2</a></li>
          <li><a>B3</a></li>
        </ol><li><a>C</a></li>
        </ol>

Answer 1

子ol需要位于li元素内：

ol {
  counter-reset: item;
  list-style-type: decimal;
}
li {
  display: block;
}
li::before {
  content: counters(item, ".")") ";
  counter-increment: item
}

<ol>
  <li>
    <a>A</a>
    <ol>
      <li><a>A1</a>
      </li>
      <li><a>A2</a>
      </li>
      <li><a>A3</a>
      </li>
      <li><a>A4</a>
      </li>
    </ol>
  </li>
  <li>
    <a>B</a>
    <ol>
      <li><a>B1</a>
      </li>
      <li><a>B2</a>
      </li>
      <li><a>B3</a>
      </li>
    </ol>
  </li>
  <li>
    <a>C</a>
  </li>
</ol>