Li ul: Тег | htmlbook.ru

Leave a Comment / Разное / By /

| HTML | WebReference

Элемент <ul> (от англ. unordered list — неупорядоченный список) устанавливает маркированный список. Каждый пункт списка должен начинаться с элемента <li>.

Синтаксис

<ul>
  <li>пункт маркированного списка</li>
</ul>

Атрибуты

type
Устанавливает вид маркера списка.

Также для этого элемента доступны универсальные атрибуты и события.

Пример

<!DOCTYPE html> <html> <head> <meta charset=»utf-8″> <title>UL</title> </head> <body> <ul> <li>Баал</li> <li>Агарес</li> <li>Марбас</li> <li>Пруфлас</li> <li>Аамон</li> </ul> </body> </html>

Результат данного примера показан на рис. 1.

Рис. 1. Вид маркированного списка в браузере

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

СпецификацияСтатус
WHATWG HTML Living StandardЖивой стандарт
HTML5Рекомендация
HTML 4. 01 Specification		Рекомендация
Спецификация

Каждая спецификация проходит несколько стадий одобрения.

  • Recommendation (Рекомендация) — спецификация одобрена W3C и рекомендована как стандарт.
  • Candidate Recommendation (Возможная рекомендация) — группа, отвечающая за стандарт, удовлетворена, как он соответствует своим целям, но требуется помощь сообщества разработчиков по реализации стандарта.
  • Proposed Recommendation (Предлагаемая рекомендация) — на этом этапе документ представлен на рассмотрение Консультативного совета W3C для окончательного утверждения.
  • Working Draft (Рабочий проект) — более зрелая версия черновика после обсуждения и внесения поправок для рассмотрения сообществом.
  • Editor’s draft (Редакторский черновик) — черновая версия стандарта после внесения правок редакторами проекта.
  • Draft (Черновик спецификации) — первая черновая версия стандарта.

Браузеры

1121111
1161
Браузеры

В таблице браузеров применяются следующие обозначения.

  • — элемент полностью поддерживается браузером;
  • — элемент браузером не воспринимается и игнорируется;
  • — при работе возможно появление различных ошибок, либо элемент поддерживается с оговорками.

Число указывает версию браузреа, начиная с которой элемент поддерживается.

Списки

См. также

  • <li>
  • <ol>
  • Вложенные списки
  • Группа списков
  • Маркированные списки
  • Нумерация страниц
  • Нумерованные списки
  • Создание списков

Рецепты

  • Как сделать вложенный список?
  • Как сделать нумерацию римскими цифрами?
  • Как сделать нумерацию русскими буквами?
  • Как сделать нумерацию списка с определённого числа?
  • Как сделать нумерованный список?

Практика

  • Атрибут value
  • Буквенная нумерация
  • Вложенный список
  • Маркированный список
  • Навигация
  • Нумерованный список
  • Обратный список
  • Римские числа
  • Список с 11

Элементы HTML

Атрибуты

Значения

Типы элементов

Аудио и видео

Документ

Изображения

Объекты

Скрипты

Списки

Ссылки

Таблицы

Текст

Формы

Фреймы

⚡️ HTML и CSS с примерами кода

Тег <ul> (от англ. unordered list — неупорядоченный список) устанавливает маркированный (неупорядоченный) список.

Каждый пункт списка должен начинаться с элемента <li>.

Текстовые блоки
  • blockquote
  • dd
  • div
  • dl
  • dt
  • hr
  • li
  • ol
  • p
  • pre
  • ul

Синтаксис

<ul>
  <li>пункт маркированного списка</li>
</ul>

Закрывающий тег обязателен.

Атрибуты

Для этого элемента доступны универсальные атрибуты.

compact
Не используйте этот атрибут, так как он устарел: вместо этого используйте CSS. Чтобы получить эффект, аналогичный атрибуту compact, можно использовать свойство line-height со значением 80%.
Этот логический атрибут означает, что список должен отображаться в компактном стиле. Интерпретация этого атрибута зависит от пользовательского агента, и он работает не во всех браузерах.
type
Не используйте этот атрибут, так как он устарел; вместо этого используйте свойство CSS list-style-type.
Этот атрибут устанавливает стиль маркера для списка. Значения, определенные в HTML 3.2 и HTML 4.0 / 4.01:
  • circle
  • disc
  • square
  • Четвертый тип маркера был определен в интерфейсе WebTV, но не все браузеры поддерживают его: triangle.

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

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

  • WHATWG HTML Living Standard
  • HTML 5

Примеры

Пример 1

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>UL</title>
  </head>
  <body>
    <ul>
      <li>Баал</li>
      <li>Агарес</li>
      <li>Марбас</li>
      <li>Пруфлас</li>
      <li>Аамон</li>
    </ul>
  </body>
</html>

Пример 2

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

<ul>
  <li>first item</li>
  <li>
    second item
    <!-- Внимание, закрывающий тег </li> здесь не размещаем -->
    <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>
    <!-- Здесь размещается закрывающий тег </li> -->
  </li>
  <li>third item</li>
</ul>

Пример 3

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

<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>

См.

также
  • <ol>
  • <li>
  • list-style
  • line-height

Ссылки

  • Тег <ul> MDN (рус.)

Разбиение на страницы · Bootstrap

  • Обзор
  • Работа с иконками
  • Отключенное и активное состояния
  • Размер
  • Выравнивание

Документация и примеры для отображения нумерации страниц, чтобы указать, что серия связанного контента существует на нескольких страницах.

Обзор

Мы используем большой блок связанных ссылок для разбиения на страницы, благодаря чему ссылки трудно пропустить и их легко масштабировать, обеспечивая при этом большие области охвата. Разбивка на страницы создается с помощью HTML-элементов списка, поэтому программы чтения с экрана могут объявить количество доступных ссылок. Используйте обертку