为有序列表编号< OL>。像一个数组,数字周围有方括号 [英] Numbering an ordered list <OL> like an array, with brackets around the numbers
本文介绍了为有序列表编号< OL>。像一个数组,数字周围有方括号的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有此列表:
<ol start="0">
<li>Tokyo Skytree</li>
<li>Canton Tower</li>
<li>CN Tower</li>
<li>Ostankino Tower</li>
<li>Oriental Pearl Tower</li>
</ol>
其中显示如下内容:
1. Tokyo Skytree
2. Canton Tower
3. CN Tower
4. Ostankino Tower
5. Oriental Pearl Tower
现在我想要的是这样的东西:
Now what I want is to have something like this:
[1] Tokyo Skytree
[2] Canton Tower
[3] CN Tower
[4] Ostankino Tower
[5] Oriental Pearl Tower
理想情况下,我希望使用基于0的数组:
Ideally I want a 0-based array like:
[0] = Tokyo Skytree
[1] = Canton Tower
[2] = CN Tower
[3] = Ostankino Tower
[4] = Oriental Pearl Tower
我读过有关 CSS编号样式和 CSS列出了W3C草案,但我找不到能解决问题的解决方案。
I've read about CSS Numbering Style and CSS Lists W3C Draft but I cannot figure out a solution that works.
推荐答案
您可以做这样的事情:
ol {
counter-reset: o-counter -1;
list-style-type: none;
}
ol li:before {
content: '[' counter(o-counter) '] = ';
counter-increment: o-counter;
}
http://jsfiddle.net/userdude/Fb3ab/2/
请记住 o-counter
(或您所说的其他名称)必须位于父 UL
/ OL
使其递增。而且,IE7也不支持。
Keep in mind the o-counter
(or whatever you call it) needs to be on the parent UL
/OL
for it to increment. And, IE7 does not support this either.
更多信息:
- < a href = http://www.w3.org/TR/CSS21/generate.html#counters rel = nofollow> http://www.w3.org/TR/CSS21/generate.html#counters
- http://css-infos.net/property / content
- http://www.w3.org/TR/CSS21/generate.html#counters
- http://css-infos.net/property/content
这篇关于为有序列表编号< OL>。像一个数组,数字周围有方括号的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文