如何在有序列表中隐藏子弹编号后面的点？

Question

最初，我认为我可以使用：CSS中的第一个字母，遗留浏览器支持，但我不认为子弹数字在技术上存在于DOM中。假设我不会使用子弹列表图像或背景图像。

类似于：

1. 苹果
2. 香蕉
3. 橙子

会变成

1个苹果
2香蕉
3个橘子

Answer 1

从this answer开始，答案似乎是：

ol { 
    counter-reset: item;
    list-style-type: none;
}
ol li { display: block; }
ol li:before { 
    content: counter(item) "  "; 
    counter-increment: item;
}

另请参阅：http://jsbin.com/ukojo4/

Answer 2

Sean提供的解决方案的一个问题是你松开了数字的良好对齐。

除去点的另一种方法是通过在它们上面放置其他东西来隐藏它们：

ol li:before {
    content: ".";
    color: #fff;        // color it in white (or whatever background you have)
    float: left;
    font-size: 20px;    // make it bigger.
    font-weight: bold;  // and bolder
    position: absolute; 
    left: 18px;         // horizontal offset
    line-height: 13px;  // vertical offset
}

您可能需要使用 left 和 line-height 来正确放置白点，具体取决于您的实际填充和边距。

在此处查看http://jsfiddle.net/HGfty/

Answer 3

以下是您在另一篇文章中的回答。我能够修改小提琴以获得答案

Custom ordered list format

编辑：看起来像肖恩已经到了。他的回答是+1。