<ol>: The Ordered List element
==============================

**HTML-элемент `<ol>`** используется для упорядоченного списка — в частности для пронумерованного списка.

Интерактивный пример
--------------------

| Категории контента (en-US) | Основной поток, и если дочерний элемент `<ol>` включает в себя хотя бы один элемент `<li>`, явный контент. |
| --- | --- |
| Допустимое содержимое | Ноль или больше `<li>` элементов, которые, в свою очередь, содержат вложенные элементы `<ol>` или `<ul>`. |
| Пропуск тегов | Нет, открывающий и закрывающий теги обязательны. |
| Допустимые родители | Любой элемент, который принимает основной поток. |
| Допустимые ARIA-роли | `directory (en-US)`, `group (en-US)`, `listbox (en-US)`, `menu (en-US)`, `menubar (en-US)`, `radiogroup (en-US)`, `tablist (en-US)`, `toolbar (en-US)`, `tree (en-US)`, `presentation (en-US)` |
| DOM-интерфейс | `HTMLOListElement` (en-US) |

Свойства
--------

Этот элемент включает глобальные атрибуты.

`reversed`

Атрибут логического значения (bool) показывает, что предметы указаны по списку в обратном порядке. Пункты в списке будут пронумерованы от большего к меньшему.

`start`

Нумерация начнётся с указанного числа. Арабскими цифрами (1, 2, 3, и т.д.), даже когда нумерация `type` в буквах или Римском исчислении. Например, чтобы начать нумерацию с буквы "г" или Римской "iv", используйте `start="4"`.

`type`

Задаёт тип нумерации:

* `a` для строчных букв
* `A` для заглавных букв
* `i` для строчной Римской нумерации
* `I` для заглавной Римской нумерации
* `1` для цифр (по умолчанию)указанный тип используется для всего списка, если только не указан любой другой атрибут `type` в элементе `<li>`.

**Примечание:** Если тип цифр в списке не имеет значения (к примеру, юридические или технические документы, где элементы обозначены буквами/цифрами), используйте свойство CSS `list-style-type` (en-US).

Примечания об использовании
---------------------------

Обычно, элементы списка отображены с маркером, предшествующим цифрам или буквам.

`Элементы <ol>` и `<ul>` могут быть вложены (nested) на любом уровне, чередуясь между элементами `<ol>` и `<ul>`.

Оба элемента `<ol>` и `<ul>` используются для списков. Различие лишь в том, что в элементе `<ol>` порядок имеет значение, как в данных примерах:

* Инструкции рецепта
* Направление по заданному маршруту
* Список ингредиентов на информации о питании, в убывающих пропорциях.

Чтобы определить, каким списком пользоваться, можно поменять порядок элементов с списке.Если значение меняется, используйте элемент `<ol>` — в противном случае `<ul>`.

Примеры
-------

### Обычный список


```html
<ol>
  <li>Fee</li>
  <li>Fi</li>
  <li>Fo</li>
  <li>Fum</li>
</ol>
```


Результат HTML кода выше:

### Список с Римскими числами


```html
<ol type="i">
  <li>Introduction</li>
  <li>List of Greivances</li>
  <li>Conclusion</li>
</ol>
```


Результат HTML кода выше:

### Используя свойство `start`


```html
<p>Finishing places of contestants not in the winners’ circle:</p>

<ol start="4">
  <li>Speedwalk Stu</li>
  <li>Saunterin’ Sam</li>
  <li>Slowpoke Rodriguez</li>
</ol>
```


Результат HTML кода выше:

### Вложенный список


```html
<ol>
  <li>first item</li>
  <li>
    second item
    <!-- closing </li> tag not here! -->
    <ol>
      <li>second item first subitem</li>
      <li>second item second subitem</li>
      <li>second item third subitem</li>
    </ol>
  </li>
  <!-- Here's the closing </li> tag -->
  <li>third item</li>
</ol>
```


Результат HTML кода выше:

### Неупорядоченный список внутри упорядоченного списка


```html
<ol>
  <li>first item</li>
  <li>
    second item
    <!-- closing </li> tag not here! -->
    <ul>
      <li>second item first subitem</li>
      <li>second item second subitem</li>
      <li>second item third subitem</li>
    </ul>
  </li>
  <!-- Here's the closing </li> tag -->
  <li>third item</li>
</ol>
```


Результат HTML кода выше:

Спецификации
------------

| Specification |
| --- |
| HTML Standard # the-ol-element |

Совместимость с браузерами
--------------------------

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

Смотрите также
--------------

* Другие элементы HTML списка: `<ul>`, `<li>`, `<menu>`
* CSS-свойства, которые могут быть полезны для стилизации `<ol>` элемента:
    + свойство `list-style` (en-US), для порядковых показов
    + CSS счётчики, для более сложных вложенных списков
    + свойство line-height, для замены убранного свойства `compact`
    + Свойство margin, для контроля отступа в списке