Списки
Основные понятия
Файловая структура
Структура
HTML документа
Тег <BODY>
Тег <FONT>
Теги форматирования текста
Специальные символы
Абзацы
Линия - разделитель
Списки
Рисунки
Гиперссылки
Таблицы
Сводная таблица тегов HTML
Списком называется взаимосвязанный набор отдельных фраз или предложений, которые начинаются с маркера или цифры.
Списки предоставляют возможность упорядочить и систематизировать данные для представления их в наглядном и удобном для пользователя виде.
Списки подразделяются на:
  • Маркированные списки
  • Нумерованные списки
  • Списки определений
  • Вложенные списки

Маркированные списки

Перед каждым элементом маркированного списка автоматически добавляется небольшой маркер.
Список ограничен парным тэгом <UL>...</UL> (от английского unordered list — неупорядоченный список).
Каждый элемент списка начинается с тега <LI>, после которого можно располагать текст, рисунки, таблицы и т.п. Заканчивается элемент списка тегом </LI>.
Маркеры могут принимать один из трех видов: круг (по умолчанию), окружность и квадрат. Для выбора стиля маркера используется значение атрибута type тега <UL>.

Примеры использования маркированных списков

Тип спискаКод HTMLРезультат
  По умолчанию
<ul>
<li>Первый элемент</li>
<li>Второй элемент</li>
<li>Третий элемент</li>
</ul>
  • Первый элемент
  • Второй элемент
  • Третий элемент
  Список с маркерами в виде круга
<ul type="disc">
<li>Первый элемент</li>
<li>Второй элемент</li>
<li>Третий элемент</li>
</ul>
  • Первый элемент
  • Второй элемент
  • Третий элемент
  Список с маркерами в виде окружности
<ul type="circle">
<li>Первый элемент</li>
<li>Второй элемент</li>
<li>Третий элемент</li>
</ul>
  • Первый элемент
  • Второй элемент
  • Третий элемент
  Список с квадратными маркерами
<ul type="square">
<li>Первый элемент</li>
<li>Второй элемент</li>
<li>Третий элемент</li>
</ul>
  • Первый элемент
  • Второй элемент
  • Третий элемент

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

Нумерованные списки представляют собой набор элементов с их порядковыми номерами. Нумерация может быть числовой или буквенной.
Список ограничен парным тэгом <OL>...</OL> (от английского ordered list — упорядоченный список).
Каждый элемент списка начинается с тега <LI>, после которого можно располагать текст, рисунки, таблицы и т.п. Заканчивается элемент списка тегом </LI>.
В качестве нумерующих элементов могут выступать следующие значения:
  • арабские числа (1, 2, 3, ...);
  • прописные латинские буквы (A, B, C, ...);
  • строчные латинские буквы (a, b, c, ...);
  • прописные римские числа (I, II, III, ...);
  • строчные римские числа (i, ii, iii, ...).
Для указания типа нумерованного списка применяется значение атрибута type тега <OL>.
Чтобы начать список с определенного значения, используется значение атрибута start тега <OL>. Значение атрибута start задается арабскими цифрами.

Примеры использования нумерованных списков

Тип спискаКод HTMLРезультат
  По умолчанию
<ol>
<li>Первый элемент</li>
<li>Второй элемент</li>
<li>Третий элемент</li>
</ol>
  1. Первый элемент
  2. Второй элемент
  3. Третий элемент
  Арабские числа
<ol type="1" start="8">
<li>Первый элемент</li>
<li>Второй элемент</li>
<li>Третий элемент</li>
</ol>
  1. Первый элемент
  2. Второй элемент
  3. Третий элемент
  Прописные буквы латинского алфавита
<ol type="A">
<li>Первый элемент</li>
<li>Второй элемент</li>
<li>Третий элемент</li>
</ol>
  1. Первый элемент
  2. Второй элемент
  3. Третий элемент
  Строчные буквы латинского алфавита
<ol type="a" start="4">
<li>Первый элемент</li>
<li>Второй элемент</li>
<li>Третий элемент</li>
</ol>
  1. Первый элемент
  2. Второй элемент
  3. Третий элемент
  Римские числа в верхнем регистре
<ol type="I" start="8">
<li>Первый элемент</li>
<li>Второй элемент</li>
<li>Третий элемент</li>
</ol>
  1. Первый элемент
  2. Второй элемент
  3. Третий элемент
  Римские числа в нижнем регистре
<ol type="i">
<li>Первый элемент</li>
<li>Второй элемент</li>
<li>Третий элемент</li>
</ol>
  1. Первый элемент
  2. Второй элемент
  3. Третий элемент

Списки определений

Так называются списки, в которых приводятся определения понятий и терминов. Каждый элемент такого списка содержит две записи - сам термин и его определение. Нумерация отсутствует.
Список ограничен парным тэгом <DL>...</DL> (от английского definition list — список определений).
Внутри тега <DL>...</DL> вложены парные теги:
  • <DT>...</DT> (от английского definition term — термин)
  • <DD>...</DD> (от английского definition definition — определение термина)

Пример

<HTML>
<HEAD>
<TITLE>Список определений</TITLE>
</HEAD>
<BODY>
<DL>
<DT>Web-сайт</DT>
<DD>Сайт (от англ. website: web - «паутина, сеть» и site - «место».<br>Web-сайт это набор Web-страниц, связанных между собой гиперссылками и единым оформлением.</DD>
<DT>Web-страницы</DT>
<DD>это обычные текстовые файлы, в которых с помощью специальных команд задается оформление страницы и расположение материала.<br>Все рисунки, анимация, апплеты Java и т.п. должны быть записаны в виде отдельных файлов.</DD>
</DL>
</BODY>
</HTML>
А вот как выглядит этот список в окне браузера Firefox: