html - 数字后的 HTML 列表文本缩进

Question

如何增加有序列表中数字和文本之间的边距？

IE

<ol>
  <li>text 1</li>
  <li>text 2</li>
  <li>text 3</li>
</ol>

生产

1. 文本1
2. 文本 2
3. 文字 3

而且我要

1. __ 文本1
2. __ 文本 2
3. __ 文本 3

其中 __ 是任意缩进。

Answer 1

<ol>
<li><span class="indent">text 1</span></li>
<li><span class="indent">text 2</span></li>
<li><span class="indent">text 3</span></li>
</ol>
<style="text/css">
ol li .indent{padding-left:20px;}
</style>

Answer 2

在这里找到了答案

我修改了小提琴来满足我的需要。

ol {
    counter-reset: item;
    margin-left: 0;
    padding-left: 0;
}
li {
    display: block;
    margin-bottom: .5em;
    margin-left: 2em;
}

li:before {
    display: inline-block;
    content: counter(item) ".";
    counter-increment: item;
    width: 2em;
    margin-left: -2em;
}