Урок 123 із 239
51%
← Назад

Числа з нулем попереду для списків ol в CSS

Вивчаємо значення decimal-leading-zero властивості list-style-type для створення нумерації списку ol з нулем перед однозначними числами.

Числа з нулем попереду для списків ol в CSS

Властивість list-style-type дозволяє змінювати формат нумерації у списках ol.

Значення decimal-leading-zero створює нумерацію у вигляді чисел із нулем попереду для значень менше десяти.

Наприклад, замість 1, 2, 3 список буде показувати 01, 02, 03.

<ol>
  <li>list item</li>
  <li>list item</li>
  <li>list item</li>
  <li>list item</li>
  <li>list item</li>
</ol>
ol {
  list-style-type: decimal-leading-zero;
}
❗ Важливо:

Такий формат нумерації часто використовують у змістах, каталогах, списках завдань та документах.

  • decimal — звичайні числа (1, 2, 3).
  • decimal-leading-zero — числа з нулем попереду (01, 02, 03).
  • lower-alpha — маленькі латинські літери (a, b, c).
  • upper-roman — великі римські цифри (I, II, III).
📌 Завдання:
  1. №1. Створіть список ol із десяти пунктів.
  2. №2. Застосуйте list-style-type: decimal-leading-zero.
  3. №3. Порівняйте результат із нумерацією decimal.
💡 Показати підказку

Нуль додається тільки перед однозначними числами. Числа 10, 11, 12 і далі залишаються без змін.

✅ Показати відповідь
ol {
  list-style-type: decimal-leading-zero;
}