通过CSS从已排序的<ol>列表中删除小数？</ol>

Question

我认为答案是“不”，但我想我会向你们所有的CSS忍者提出这个问题，因为它之前已经出现了，当你在挖掘涉及整个团队的代码时，最快乐的答案并不总是“好，只是重做代码。”

给出一个有序列表：

<ol>
    <li>...</li>
    <li>...</li>
    <li>...</li>
</ol>

是否可以删除小数点但通过JUST CSS保留编号，没有javascript hackery等？我的直觉和经验说“绝对没有”，但我知道那里有一些很有创意的类型，我想知道是否有一些我还没有考虑过的东西。

更新

可能的文字示例，请求：

转换如下所示的有序列表：

1. [...content...]
2. [...content...]
3. [...content...]

对于这样的事情：

1 [...content...]
2 [...content...]
3 [...content...]

全部使用CSS wizardy，没有javascript。再一次，我意识到这可能是不可能的，但是你永远都不会知道，做你。

Answer 1

这适用于Firefox 3.6.6和Chrome 6，但不适用于IE7或IE8（在那里并不令人惊讶）。

OL { counter-reset: item }
LI { display: block }
LI:before { content: counter(item) " "; counter-increment: item }

请参阅http://www.w3.org/TR/CSS2/generate.html#scope

Answer 2

对于低技术但高度跨浏览器兼容的解决方案，您可以使用垂直堆叠数字应用于ol的背景图像;只需指定一个line-height即可确保全部对齐。