<ul>: Элемент неупорядоченного списка

Элемент <ul> HTML представляет неупорядоченный список элементов, обычно отображаемый как список с маркерами.

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

compact Устаревший

Этот булевый атрибут указывает на то, что список должен быть отображён в компактном стиле. Интерпретация этого атрибута зависит от браузера, и он не работает во всех браузерах.

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

type Устаревший

Этот атрибут устанавливает стиль маркера для списка. Значения, определённые в HTML3.2 и переходной версии HTML 4.0/4.01, следующие:

• circle
• disc
• square

Четвёртый тип маркера был определён в интерфейсе WebTV, но не все браузеры его поддерживают: triangle.

Если он отсутствует и если к элементу не применяется свойство CSS list-style-type, браузер выбирает тип маркера в зависимости от уровня вложенности списка.

Предупреждение: Не используйте этот атрибут, так как он устарел; используйте свойство CSS list-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>

Результат

<ul>
  <li>first item</li>
  <li>
    second item
    <!-- Look, the closing </li> tag is not placed here! -->
    <ul>
      <li>second item first subitem</li>
      <li>
        second item second subitem
        <!-- Same for the second nested unordered list! -->
        <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>
      <!-- Closing </li> tag for the li that
                  contains the third unordered list -->
      <li>second item third subitem</li>
    </ul>
    <!-- Here is the closing </li> tag -->
  </li>
  <li>third item</li>
</ul>

Результат

<ul>
  <li>first item</li>
  <li>
    second item
    <!-- Look, the closing </li> tag is not placed here! -->
    <ol>
      <li>second item first subitem</li>
      <li>second item second subitem</li>
      <li>second item third subitem</li>
    </ol>
    <!-- Here is the closing </li> tag -->
  </li>
  <li>third item</li>
</ul>

Результат

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