<ol>
我的HTML
文档中有一个标签(有序列表)。我希望它以以下格式显示项目:
(i) Item 1
(ii) Item 2
(iii) Item 3
目前,我可以使用以下HTML
代码:
<ol type="i">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ol>
这给了我以下结果:
i. Item 1
ii. Item 2
iii. Item 3
是否可以按照我在此问题开始时提到的期望方式来显示我的列表?
编辑: 跟进问题,这也是公认的答案的一部分
如何获取包装好的项目(对于一行而言太长的项目)以在同一标签行上自动开始新行?
仅使用CSS3
,您可以执行以下操作:
ol {
counter-reset: increment_var;
list-style-type: none;
}
li:before {
display: inline-block;
content: "(" counter(increment_var, lower-roman) ") ";
counter-increment: increment_var;
width: 40px;
margin-left: -40px;
}
li {
margin-left: 40px;
}
<ol>
<li>Example 1 Example 1 Example 1 Example 1 Example 1 Example 1 Example 1 Example 1 Example 1</li>
<li>Example 2</li>
<li>Example 3</li>
<li>Example 4</li>
<li>Example 5</li>
</ol>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句