我需要在css的帮助下生成这样的输出...
(i)需求是什么?
(ii)针对哪个部分?
(iii)考虑到创新...
(iv)考虑到创新...
...and等等。
请提个建议。
发布于 2012-05-10 11:52:39
您可以使用counter-increment
属性.write来实现这一点,如下所示:
ul{
counter-reset:item;
list-style:none;
}
li:before {
content: "("counter(item, lower-roman) ")";
counter-increment: item;
}
检查此http://jsfiddle.net/MEBxA/
这是工作到IE8及以上。
发布于 2012-05-10 12:23:34
通常,当您想要与使用list-style-type
就可以实现的编号样式有任何不同的编号时,基本上有两种选择:
list-style: none
抑制默认编号,并使用计数器、生成的内容和:before
伪元素生成编号(就像在sandeep的and中一样,可以使用服务器端技术生成这些编号。要么取消ul
的默认编号,要么(稍微安全一点)根本不使用ul
标记,而是使用div
元素或table
标记。后一种方法的最简单示例:
(i) What is the demand?<br>
(ii) For what segment(s)?<br>
…
为了使整个列表、其项目和数字的呈现更容易样式化,最好使用更详细的标记,最好这样做:
<div class=ol>
<div class=li><span class=num>(i)</span> What is the demand?</div>
<div class=li><span class=num>(ii)</span> For what segment(s)?</div>
…
</div>
(使用blockquote
而不是div
作为最外层的标记将极大地改善回退,即非CSS呈现,但它可能会引起“语义错误”标记的指责。)
https://stackoverflow.com/questions/10527186
复制相似问题