具有多个级别的HTML单个编号列表

Question

目前我有一个看起来像这样的嵌套列表

<ul>
    <li>Potatoes</li>
        <ul>
            <li>Sweet Potatoes</li>
            <li>Fried Chips</li>
        </ul>
</ul>

它呈现如下：

1. 马铃薯

   1. 甘薯

   2. Fried Chips

有没有办法让它呈现项目，好像它是一个包含多个级别的列表，例如：

1. 马铃薯

   1.1甘薯

   1.2炸薯条

Answer 1

你去吧！ ：）

ol {
    counter-reset: item;
}
ol li {
    display: block;
    position: relative;
}
ol li:before {
    content: counters(item, ".")".";
    counter-increment: item;
    position: absolute;
    margin-right: 100%;
    right: 10px; /* space between number and text */
}

Answer 2

试试这个：

li li:before {
counter-increment: item;
content: counter(item) ". ";
}

双'li'是在第二级进行的。