Как вы скрываете точку после номера пули в упорядоченном списке?

Первоначально я думал, что могу использовать: первую букву в CSS, поддержку старого браузера, но я не думаю, что номера пулей технически существуют в DOM. Предположим, что я не буду использовать изображения в виде пули или фоновые изображения.

Так что-то вроде:

  • Яблоки
  • Бананы
  • Апельсины

станет

  1 Яблоки
  2 Бананы
  3 апельсины

Ответы

Ответ 1

Из этого ответа, кажется, что ответ:

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/

Ответ 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
}

Вам, возможно, придется поиграть с левой и строчной высотой, чтобы правильно поместить белые точки, в зависимости от ваших фактических paddings и полей.

Смотрите здесь в действии http://jsfiddle.net/HGfty/