Html有序列表1.1,1.2（嵌套计数器和范围）不起作用
我使用嵌套计数器和范围来创build一个HTMLsorting列表。
这是我的代码： http : //jsfiddle.net/qGCUk/2/
我期待以下结果：
1. one 2. two 2.1. two.one 2.2. two.two 2.3. two.three 3. three 3.1 three.one 3.2 three.two 3.2.1 three.two.one 3.2.2 three.two.two 4. four 相反，这是我所看到的（错误的编号） ：
1. one 2. two 2.1. two.one 2.2. two.two 2.3. two.three 2.4 three <!-- this is where it goes wrong, when going back to the parent --> 2.1 three.one 2.2 three.two 2.2.1 three.two.one 2.2.2 three.two.two 2.3 four
我没有线索，有没有人看到哪里出了问题？
取消select“正常化CSS” – http://jsfiddle.net/qGCUk/3/ CSS中使用的重置默认所有列表边距和填充为0
更新 http://jsfiddle.net/qGCUk/4/ – 你必须包括你的子列表在你的主要<li>
<ol> <li>one</li> <li>two <ol> <li>two.one</li> <li>two.two</li> <li>two.three</li> </ol> </li> <li>three <ol> <li>three.one</li> <li>three.two <ol> <li>three.two.one</li> <li>three.two.two</li> </ol> </li> </ol> </li> <li>four</li> </ol>
使用此样式仅更改嵌套列表：
ol { counter-reset: item; } ol > li { counter-increment: item; } ol ol > li { display: block; } ol ol > li:before { content: counters(item, ".") ". "; margin-left: -20px; }
看一下这个 ：
你的问题似乎已经修复。
什么显示为我（在Chrome和Mac OS X下）
1. one 2. two 2.1. two.one 2.2. two.two 2.3. two.three 3. three 3.1 three.one 3.2 three.two 3.2.1 three.two.one 3.2.2 three.two.two 4. four
我是怎么做到的
代替 ：
<li>Item 1</li> <li>Item 2</li> <ol> <li>Subitem 1</li> <li>Subitem 2</li> </ol>
做：
<li>Item 1</li> <li>Item 2 <ol> <li>Subitem 1</li> <li>Subitem 2</li> </ol> </li>
这是一个很好的解决scheme！ 有了一些额外的CSS规则，你可以像一个MS Word大纲列表一样将其格式化为一个首行缩进：
OL { counter-reset: item; } LI { display: block; } LI:before { content: counters(item, ".") "."; counter-increment: item; padding-right:10px; margin-left:-20px; }
我最近遇到类似的问题。 解决方法是将有序列表中的li项目的display属性设置为list-item，而不是display块，并确保ol的显示属性不是list-item。 即
li { display: list-item;}
有了这个，htmlparsing器将所有的li视为列表项并为其分配适当的值，并将ol视为基于您的设置的内嵌块或块元素，并且不会尝试将任何计数值分配给它。
