我有一个嵌套的有序列表。
- first
- second
- second nested first element
- second nested secondelement
- second nested thirdelement
- third
- fourth
当前,嵌套元素从1开始再次返回,例如。
>第一
>第二
>第二个嵌套的第一个元素
>第二个嵌套的第二个元素
>第二个嵌套的第三个元素
>第三
>第四
我想要的是第二个元素编号如下:
>第一
>第二
2.1。第二嵌套第一元素
2.2。第二嵌套第二元素
2.3。第二嵌套第三元素
>第三
>第四
有没有办法做到这一点?
这里有一个在所有浏览器中都有效的示例。纯CSS方法适用于实际的浏览器(即IE6 / 7以外的所有内容),
jQuery代码覆盖了不支持的。它在
SSCCE的味道,你可以只是copy’n’paste’nrrun没有改变。
SO question 2729927$(document).ready(function() {
if ($('ol:first').css('list-style-type') != 'none') { /* For IE6/7 only. */
$('ol ol').each(function(i,ol) {
ol = $(ol);
var level1 = ol.closest('li').index() + 1;
ol.children('li').each(function(i,li) {
li = $(li);
var level2 = level1 + '.' + (li.index() + 1);
li.prepend('' + level2 + '');
});
});
}
});
html>/**/body ol { /* Won't be interpreted by IE6/7. */
list-style-type: none;
counter-reset: level1;
}
ol li:before {
content: counter(level1) ". ";
counter-increment: level1;
}
ol li ol {
list-style-type: none;
counter-reset: level2;
}
ol li ol li:before {
content: counter(level1) "." counter(level2) " ";
counter-increment: level2;
}
ol li span { /* For IE6/7. */
margin: 0 5px 0 -25px;
}
- first
- second
- second nested first element
- second nested second element
- second nested third element
- third
- fourth