<ul> - элемент «Неупорядоченный список»
=======================================

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

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

| Категории контента (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-интерфейс | `HTMLUListElement` (en-US) |

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

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

`compact` 
Устарело

Атрибут логического значения (bool) говорит о том, что список будет представлен в более компактном стиле. Интерпретация этого атрибута зависит от user agent и не работает со всеми браузерами.

**Предупреждение:** Не используйте этот атрибут, ибо он устаревший и больше не используется, используйте CSS. Для схожего эффекта с `compact`, подойдёт свойство CSS `line-height` с значением `80%`.

`type` 
Устарело

Этот атрибут добавляет маркеры (bullets) в список. Значения установлены под HTML3.2 и переходными на HTML 4.0/4.01 являются:

* `circle`
* `disc`
* `square` Четвёртый маркер задан в интерфейсе WebTV, но не все браузеры смогут его отобразить: `triangle`.Если данный атрибут отсутствует и если атрибут CSS `list-style-type` (en-US) не присвоен к данному элементу, пользовательский агент (user agent) выберет маркер в зависимости от вложенного уровня в списке.

**Предупреждение:** Не используйте этот атрибут, ибо он устаревший; используйте свойство CSS `list-style-type` (en-US).

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

* Элемент `<ul>` используется для группировки непронумерованных элементов данных, и их последовательность в списке не нужна. Что характерно, непорядочные списки используют маркеры, которые могут быть разных форм (в форме точки, круга или прямоугольной формы). Стиль задаётся не в HTML, а со связанным с ним CSS, используя свойство `list-style-type` (en-US).
* Элементы `<ul>` и `<ol>` могут быть вложены на любом уровне. Более того, вложенные списки могут чередоваться между `<ol>` и `<ul>` без ограничений.
* Элементы `<ol>` и `<ul>` используются для списков. Различие лишь в том, что в элементе `<ol>` порядок имеет значение. Согласно эмпирической закономерности (или правилу большого пальца), чтобы определить, какую маркировку использовать, попробуйте поменять порядок элементов в списке. Если суть списка меняется, то тогда подойдёт элемент `<ol>`, в противном случае используйте `<ul>`.
Примеры
-------

### Простой список


```html
<ul>
  <li>first item</li>
  <li>second item</li>
  <li>third item</li>
</ul>
```


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

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


```html
<ul>
  <li>first item</li>
  <li>
    second item
    <!-- Закрывающий тег </li> пишем не здесь! -->
    <ul>
      <li>second item first subitem</li>
      <li>
        second item second subitem
        <!-- То же самое для второго вложенного неупорядоченного списка! -->
        <ul>
          <li>second item second subitem first sub-subitem</li>
          <li>second item second subitem second sub-subitem</li>
          <li>second item second subitem third sub-subitem</li>
        </ul>
      </li>
      <!-- Закрывающий тег </li>, который
закрывает третий неупорядоченный список -->
      <li>second item third subitem</li>
    </ul>
    <!-- Вот закрывающий тег </li> -->
  </li>
  <li>third item</li>
</ul>
```


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

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


```html
<ul>
  <li>first item</li>
  <li>
    second item
    <!-- Закрывающий тег </li> пишем не здесь! -->
    <ol>
      <li>second item first subitem</li>
      <li>second item second subitem</li>
      <li>second item third subitem</li>
    </ol>
    <!-- Вот закрывающий тег </li> -->
  </li>
  <li>third item</li>
</ul>
```


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

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

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

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

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

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

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