<ol> - HTML-елемент впорядкованого списку

HTML-елемент <ol> (або впорядкований список) представляє собою список елементів, порядок яких є важливим, наприклад, інструкції, рецепти, або рейтинг. Елементи списку зазвичай відображаються з числовим або літерним маркером.

HTML
<ol>
  <li>Перший елемент</li>
  <li>Другий елемент</li>
  <li>Третій елемент</li>
</ol>

Атрибути

Цей тег може мати глобальні атрибути.

reversed

Булевий атрибут, який вказує, що порядок нумерації елементів списку буде зворотнім (від більшого до меншого).

start

Число, з якого починається нумерація списку. За замовчуванням — 1.

type

Визначає тип маркера для нумерації:

"a": маленькі літери
"A": великі літери
"i": маленькі римські цифри
"I": великі римські цифри
"1": числа (за замовчуванням)

Технічне резюме

Категорія контенту	Потоковий контент. Якщо його дочірні елементи включають один або більше елементів `<li>`, то також відчутний контент.
Дозволений вміст	Нуль або більше елементів `<li>`, `<script>`, `<template>`.
Пропуск тегів	Жоден, початковий та кінцевий теги є обов’язковими.
Дозволені батьківські елементи	Будь-який елемент, що приймає потоковий контент.
Роль ARIA	`list`
DOM інтерфейс	`HTMLOListElement`

Приклади використання

<ol>
  <li>Нарізати овочі</li>
  <li>Змішати інгредієнти</li>
  <li>Заправити соусом</li>
</ol>

<ol type="I" start="3">
  <li>Третій розділ</li>
  <li>Четвертий розділ</li>
  <li>П’ятий розділ</li>
</ol>

<ol reversed>
  <li>Три</li>
  <li>Два</li>
  <li>Один</li>
  <li>Старт!</li>
</ol>

Стилі за замовчуванням

CSS
ol {
  display: block;
  list-style-type: decimal;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  padding-inline-start: 40px;
}

Підтримка браузерів



`<ol>`
`compact`
`reversed`
`start`
`type`