counters() = [ counters(name, string) | counters(name, string, list-style-type) ]{1,}
counters()类似于重复使用了counter(),来看个示例
HTML:
- Node
- Node
- Node
- Node
- Node
counters():
ol {
counter-reset: item;
}
li:before {
counter-increment: item;
content: counters(item, ".");
}
counter():
.test2 {
counter-reset: item;
}
.test2 li {
counter-increment: item;
}
.test2 li:before {
content: counter(item)".";
}
.test2 li li {
counter-increment: subitem;
}
.test2 li li:before {
content: counter(item)"."counter(subitem);
}
从上述代码可以看出,counters()适合使用在需要继承的章节上,而counter()更适合用在独立的计数场景上。
IE | Firefox | Chrome | Safari | Opera | iOS Safari | Android Browser | Android Chrome |
---|---|---|---|---|---|---|---|
6.0-7.0 | 2.0+ | 4.0+ | 3.1+ | 3.5+ | 3.2+ | 2.1+ | 18.0+ |
8.0+ |