Добавление текста перед списком

Question

Я пытаюсь сделать список вроде
Элемент 1. птица
Элемент 2. Лев
...

Проблема в том, что я не хочу писать «Элемент» для каждого элемента. Есть ли способ добавить контент в мой список?

Answer 1

Вам нужно CSS-счетчики :

#customlist {
  /* delete default counter */
  list-style-type: none;
  /* create custom counter and set it to 0 */
  counter-reset: elementcounter;
}

#customlist>li:before {
  /* print out "Element " followed by the current counter value */
  content: "Element " counter(elementcounter) ": ";
  /* increment counter */
  counter-increment: elementcounter;
}

<ol id="customlist">
  <li>Elephant</li>
  <li>Bird</li>
  <li>Lion</li>
</ol>