HTML: Вложенные (многоуровневые) списки
Список определений
Списки определений - это особый тип структуризации информации, идеально подходящий для отображения толковых и терминологических словарей, а также справочников средствами html.
В отличие от нумерованных и маркированных списков, которые могут содержать по несколько элементов, расположенных друг за другом, элементы списка определений должны состоять из двух частей: самого определения (термина) и его содержательной части (описания).
Список определений создается с помощью тега <dl> (Definition List), внутри которого указывается тег <dt> (Definition Term), выделяющий термин, и тег <dd> (Definition Description), содержащий описание к данному термину:
<html>
<body>
<h4>Список определений:</h4>
<dl>
<dt>Кофе</dt><dd>Бодрящий горячий напиток</dd>
<dt>Молоко</dt><dd>Полезный холодный напиток</dd>
</dl>
</body>
</html>
Попробовать »
Внутри элемента <dd> вы можете размещать абзацы, строки, изображения, ссылки, другие списки и т.д.
Вложенные списки
Часто информация имеет сложную разветвленную структуру, которую, с одной стороны, будет трудно отобразить в виде одного списка, с другой - невозможно разбить на несколько отдельных списков. В этом случае используются так называемые вложенные списки (список, вложенный в другой список).
Для создания вложенного списка, надо в родительский список поместить дочерний список так, чтобы все элементы дочернего списка были вложены в элемент <li> родительского списка:
<html>
<body>
<h4>Вложенный список:</h4>
<ul>
<li>Кофе</li>
<li>Чай
<ol>
<li>Черный чай</li>
<li>Зеленый чай</li>
</ol>
</li>
<li>Молоко</li>
</ul>
</body>
</html>
Попробовать »
Таким образом можно создавать многоуровневые списки.
Примечание: обычно вложенный список отображается с небольшим отступом вправо от родительского списка.
С этой темой смотрят: