Тег li

Последнее обновление: 22.01.2011

Тег <li> (list item — элемент списка) — тег-контейнер, создает элемент списка. Применяется внутри контейнера <ul> (маркированный список) или <ol> (нумерованный список).

HTML: 3.2 | 4 / XHTML: 1.0 | 1.1

Синтаксис


<ul>
<li>
...</li>
</ul>

<ol>
<li>
...</li>
</ol>

Атрибуты



class определяет имя используемого класса
compact флаг. Выводит список с уменьшенными отступами.
Не рекомендуется в спецификации HTML 4.01!
dir определяет направление символов:

  • ltr — слева направо
  • rtl — справа налево
id уникальный индетификатор
lang определяет язык отображаемого документа
onclick щелчок на элементе
ondblclick двойной щелчок на элементе
onkeydown нажатие клавиши, когда элемент имеет фокус
onkeypress нажатие и освобождении клавиши, когда элемент имеет фокус
onkeyup освобождение ранее нажатой клавиши, когда элемент имеет фокус
onmousedown нажатие кнопки мыши, когда элемент имеет фокус
onmousemove движение указателя мыши, когда элемент имеет фокус
onmouseout смещение указателя мыши с элемента
onmouseover помещение указателя мыши на элемент
onmouseup освобождение ранее нажатой кнопки мыши, когда элемент имеет фокус
start изменяет порядок нумерации элементов списка
Не рекомендуется в спецификации HTML 4.01!
style задает встроенную таблицу стилей
title всплывающая подсказка
type задает вид маркера
для маркированного списка

  • disc — маркер-диск (по умолчанию)
  • circle — маркер-круг
  • square — маркер-квадрат

для нумерованного

  • A — заглавные латинские буквы
  • a — строчные латинские буквы
  • I — заглавные римские цифры
  • i — строчные римские цифры
  • 1 — арабские цифры (по умолчанию)

Не рекомендуется в спецификации HTML 4.01!

value изменяет порядок нумерации элементов нумерованного списка.
Не рекомендуется в спецификации HTML 4.01!

Пример

Типы маркеров


<ul>
<li
type="disc">disc — маркер-диск (по умолчанию)</li>
<li
type="circle">circle — маркер-круг</li>
<li
type="square">square — маркер-квадрат</li>
</ul>

Нумерованные списки


<ol>
<li
type="A">Первый</li>
<li
type="A">Второй</li>
<li
type="a">Третий</li>
<li
type="a">Четвертый</li>
</ol>

— На первый-второй расчитайсь!


<ol>
<li
type="1">— Первый!</li>
<li
type="1">— Второй!</li>
<li
type="1" value="1">— Первый!</li>
<li
type="1">— Второй!</li>
</ol>

Рекомендации по использованию

  • закрывающий тег обязателен по спецификациям XHTML (</li>)
  • тег <li> должен находиться внутри контейра: <ul>, <ol>, <dir>, <menu>
  • может содержать CDATA, строчные и блочные элементы
  • обязательных атрибутов нет
  • не рекомендуем использовать атрибуты compact, start и type, вместо них следует применять таблицы стлей
  • разные браузеры могут по разному отображать один и тот же тип булетов, так же как и по умолчанию может отличаться установленный тип
Твой код:

Результат: