html - 有序列表 - 子菜单中的循环编号

Question

我已经订购了清单：

HTML：

<ol>
    <li>Item</li>
    <li>Item
        <ol>
            <li>Item</li>
            <li>Item</li>
        </ol>
    </li>
    <li>Item</li>
    <li>Item</li>
<ol>

输出：

1. Item
2. Item
    1. Item
    2. Item
3. Item
4. Item

问题：

如何申请子级别的计数？

注意：寻找简单的解决方案 CSS/HTML

想要的输出：

1. Item
2. Item
    2.1. Item
    2.2. Item
3. Item
4. Item

Answer 1

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