下面的方法对我很有效:

ol {
  list-style-type: none;
  counter-reset: item;
  margin: 0;
  padding: 0;
}

ol > li {
  display: table;
  counter-increment: item;
  margin-bottom: 0.6em;
}

ol > li:before {
  content: counters(item, ".") ") ";
  display: table-cell;
  padding-right: 0.6em;
}

li ol > li {
  margin: 0;
}

li ol > li:before {
  content: counters(item, ".") ") ";
}

看:http://jsfiddle.net/rLebz84u/2/

或者这个http://jsfiddle.net/rLebz84u/3/ 有更多和合理的文本

这里发布的解决方案对我来说并不是很好，所以我把这个问题和下面的问题混合在一起:有可能在HTML中创建多级有序列表吗?

/* Numbered lists like 1, 1.1, 2.2.1... */
ol li {display:block;} /* hide original list counter */
ol > li:first-child {counter-reset: item;} /* reset counter */
ol > li {counter-increment: item; position: relative;} /* increment counter */
ol > li:before {content:counters(item, ".") ". "; position: absolute; margin-right: 100%; right: 10px;} /* print counter */

结果:

注:截图，如果你想看到源代码或任何来自这篇文章:http://estiloasertivo.blogspot.com.es/2014/08/introduccion-running-lean-y-lean.html

所选的答案是一个很好的开始，但它本质上强制list-style-position: inside;列表项的样式，使得换行文本难以阅读。下面是一个简单的解决方案，它还可以控制数字和文本之间的空白，并根据默认行为对数字进行右对齐。

ol {
    counter-reset: item;
}
ol li {
    display: block;
    position: relative;
}
ol li:before {
    content: counters(item, ".")".";
    counter-increment: item;
    position: absolute;
    margin-right: 100%;
    right: 10px; /* space between number and text */
}

JSFiddle: http://jsfiddle.net/3J4Bu/

下面的方法对我很有效:

ol {
  list-style-type: none;
  counter-reset: item;
  margin: 0;
  padding: 0;
}

ol > li {
  display: table;
  counter-increment: item;
  margin-bottom: 0.6em;
}

ol > li:before {
  content: counters(item, ".") ") ";
  display: table-cell;
  padding-right: 0.6em;
}

li ol > li {
  margin: 0;
}

li ol > li:before {
  content: counters(item, ".") ") ";
}

看:http://jsfiddle.net/rLebz84u/2/

或者这个http://jsfiddle.net/rLebz84u/3/ 有更多和合理的文本

我有一些问题时，有两个列表和第二个是在DIV 第二个列表应该从1开始。不是2.1

<ol>
    <li>lorem</li>
    <li>lorem ipsum</li>
</ol>

<div>
    <ol>
        <li>lorem (should be 1.)</li>
        <li>lorem ipsum ( should be 2.)</li>
    </ol>
</div>

http://jsfiddle.net/3J4Bu/364/

编辑: 我用这个方法解决了问题 http://jsfiddle.net/hy5f6161/

我需要将此添加到12中发布的解决方案中，因为我使用了一个混合了有序列表和无序列表组件的列表。不加引号似乎有点奇怪，我知道，但它很管用……

ol ul li:before {
  content: no-close-quote;
  counter-increment: none;
  display: list-item;
  margin-right: 100%;
  position: absolute;
  right: 10px;
}