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

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

<ul>  <li>Milk</li>  <li>    Cheese    <ul>      <li>Blue cheese</li>      <li>Feta</li>    </ul>  </li></ul>

li {  list-style-type: circle;}li li {  list-style-type: square;}

Свойства

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

compactУстарело

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

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

typeУстарело

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

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

  Предупреждение:Не используйте этот атрибут, ибо он устаревший; используйте свойствоCSSlist-style-type.

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

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

Примеры

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

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

Результат 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 кода выше:

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

<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 кода выше:

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

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

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

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