HTML Упорядоченные списки

Тег HTML <ol> используется для создания упорядоченного (нумерованного) списка. Список может быть нумерованным цифрами или буквами алфавита.

---

Упорядоченный список HTML

Упорядоченный список начинается с тега <ol>. Каждый пункт списка начинается с тега <li>.

По умолчанию пункты списка помечаются номерами:

Пример

<ol>
  <li>Кофе</li>
  <li>Чай</li>
  <li>Молоко</li>
</ol>

---

Упордоченный список HTML — Атрибут type

Атрибут type тега <ol> определяет тип метки пунктов списка:

Тип	Описание
type="1"	Пункты будут пронумерованы цифрами (по умолчанию)
type="A"	Пункты будут пронумерованы заглавными латинскими буквами
type="a"	Пункты будут пронумерованы строчными латинскими буквами
type="I"	Пункты будут пронумерованы римскими цифрами верхнего регистра
type="i"	Пункты будут пронумерованы римскими цифрами нижнего регистра

---

Примеры

Цифры:

<ol type="1">
  <li>Кофе</li>
  <li>Чай</li>
  <li>Молоко</li>
</ol>

Результат:

1. Кофе
2. Чай
3. Молоко

Заглавные буквы:

<ol type="A">
  <li>Кофе</li>
  <li>Чай</li>
  <li>Молоко</li>
</ol>

Результат:

1. Кофе
2. Чай
3. Молоко

Строчные буквы:

<ol type="a">
  <li>Кофе</li>
  <li>Чай</li>
  <li>Молоко</li>
</ol>

Результат:

1. Кофе
2. Чай
3. Молоко

Римские цифры верхнего регистра:

<ol type="I">
  <li>Кофе</li>
  <li>Чай</li>
  <li>Молоко</li>
</ol>

Результат:

1. Кофе
2. Чай
3. Молоко

Римские цифры нижнего регистра:

<ol type="i">
  <li>Кофе</li>
  <li>Чай</li>
  <li>Молоко</li>
</ol>

Результат:

1. Кофе
2. Чай
3. Молоко

---

Управление порядком нумерации

По умолчанию упорядоченный список начинается с единицы. Если хотите задать начало счёта с конкретного числа, воспользуйтесь атрибутом start:

Пример

<ol start="50">
  <li>Кофе</li>
  <li>Чай</li>
  <li>Молоко</li>
</ol>

Результат:

50. Кофе
51. Чай
52. Молоко

---

Вложенные списки HTML

Список может быть вложенным (один список внутри другого):

Пример

<ol>
  <li>Кофе</li>
  <li>Чай
    <ol>
      <li>Черный чай</li>
      <li>Зелёный чай</li>
    </ol>
  </li>
  <li>Молоко</li>
</ol>

Примечание: Тег <li> может содержать новый список, а также другие HTML-элементы, такие как изображения и ссылки.

---

Краткое содержание главы

• Используйте элемент HTML <ol> для создания упорядоченного списка.
• Используйте атрибут type HTML для определения типа нумерации.
• Используйте элемент HTML <li> для определения пункта списка.
• Списки могут быть вложенными.
• Пункты списка могут содержать другие HTML-элементы.