Тег <li>: пункты списка
Какие элементы можно помещать в пункт списка и как делать вложенные уровни.
Зачем нужен этот элемент
li представляет отдельный пункт внутри ul, ol или menu. Пункт может содержать не только короткий текст, но и несколько абзацев, ссылку или вложенный список. Смысл списка задаётся родителем, а li обозначает его составные части.
Для читаемой разметки закрывайте каждый li явно, даже когда HTML допускает пропуск закрывающего тега. При вложении подсписок должен находиться внутри родительского пункта, а не рядом с ним на том же уровне.
Синтаксис и пример
<ul>
<li>HTML
<ul><li>Текст</li><li>Формы</li></ul>
</li>
<li>CSS</li>
</ul>Что важно в разметке
| Параметр | Как использовать |
|---|---|
| Родитель | ul, ol или menu. |
| value | Начальное значение пункта внутри ol. |
| Содержимое | Текст, ссылки, блоки и вложенные списки. |
Частая ошибка
Одинокий li вне списка — ошибка структуры. Он может выглядеть приемлемо, но документ потеряет понятную связь между пунктами.
Небольшая практика
Сделайте список тем с двумя подтемами у HTML. Откройте инспектор и проверьте фактическую вложенность.
Разберите также <ul>, <ol>: эти элементы пригодятся в том же интерфейсе.
Попробуйте сами
РЕЗУЛЬТАТ · ИЗОЛИРОВАННЫЙ ПРЕДПРОСМОТР
Измените код и нажмите «Запустить». JavaScript и внешние запросы отключены.
Самостоятельный учебный материал. Техническая документация: первоисточник по теме ↗. Если результат отличается, проверьте код и версию браузера.