Списки

«Списки»

Списки служат для привлечения внимания к тем частям документа, которые содержат перечисления чего-либо. Списки создаются автоматически. Браузер при выводе текста располагает каждый элемент списка с новой строки, проставляя в их начале соответствующие символы или маркеры. Если список дополняется новыми пунктами или укорачивается, нумерация корректируется автоматически.

Язык HTML позволяет создавать пять видов списков – маркированный (UL -unordered list – неупорядоченный), нумерованный (OL – ordered list – упорядоченный), список определений (DL – definition list), список меню (menu) и список каталогов (DIR – directory). Последние два вида считаются устаревшими и практически не употребляются.

Списки создаются элементами двух типов: одни определяют общий вид списка (UL, OL, DL, MENU, DIR), а другие задают его внутреннюю структуру (LI – элемент списка, DT – термин, DD – описание термина). Все они оформляются тегами контейнерами.

Допустимы вложенные списки.

Формы записи при создании списков следующие:

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

<UL type=”disc|square|circle”><LI> Содержание п. 1 </LI><LI> Содержание п. 2 </LI><LI> Содержание п. n </LI>

</UL>

type=”disc”

Содержание п. 1
Содержание п. 2
Содержание п. n

type=”square”

Содержание п. 1
Содержание п. 2
Содержание п. n

type=”circle”

Содержание п. 1
Содержание п. 2
Содержание п. n

Атрибут type определяет формат маркера элемента списка: диск (disc), квадрат (square), окружность (circle).

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

</OL>

type=”1”1.Сод-е п.12.Сод-е п.2

3.С-е п.j

type=”A”А. Сод-е п.1Б. Сод-е п.2

В. С-е п. j

type=”aа. Сод-е п.1б. Сод-е п.2

в. С-е п.j

type=”I”start=”10”

Сод-е п.1
Сод-е п.2
С-е п.j

type=”i”value=”100”

i. Сод-е п.1
Сод-е п.2
c. С-е п. j

Атрибут type определяет формат нумерации элемента списка: 1 (арабские цифры), А (прописные латинские буквы), а (строчные латинские буквы), I (прописные римские цифры), i (строчные римские цифры).

Атрибут start определяет, с какого номера (k) начинается список.

Атрибут value определяет, с какого номера (j) начинается текущий элемент списка.

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

<DL><DD> Термин 1 </DD><DT> Описание термина 1 </DT><DD> Термин 2 </DD>

<DT> Описание 1 термина 2 </DT>

<DT> Описание 2 термина 2 </DT>

</DL>

Термин 1Описание термина 1Термин 2

Описание 1 термина 2

Описание 2 термина 2

Текст заключенный внутри контейнера <DD> … </DD> начинается с новой строки и сдвигается на некоторое количество позиций вправо относительно остального текста.

Список меню

<MENU><LI> Содержание пункта 1 </LI><LI> Содержание пункта n </LI></MENU>

Содержание п. 1
Содержание п. n

Список каталогов

<DIR><LI> Содержание пункта 1 </LI><LI> Содержание пункта n </LI></DIR>

Содержание п. 1
Содержание п. n

Практическая работа

Создать файл list.htm на основе имеемого шаблона:

открыть шаблон для просмотра в браузере – двойной щелчок по файлу template.htm в месте его сохранения,
открыть шаблон для редактирования в текстовом редакторе Блокнот – выбрать пункт в меню браузера Вид/ В виде HTML (Просмотр HTML-кода),
сохранить шаблон под другим именем – Файл/ Сохранить как/ Тип файла – Все файлы/ Указать место сохранения, требуемое имя и расширение .htm/ Сохранить.

В созданном файле list.htm создать список сложной формы:

Откорректировать содержание <title>, записав в него фразу «Списки»,
В разделе BODY текст «Список сложной формы», оформить заголовком первого уровня с выравниванием по правому краю,

<H1 align=”right”> Список сложной формы </H1>

Ниже заголовка записать html-код создающий список сложной формы:

<UL>

<LI>Пункт 1

<OL>

<LI>Пункт 1.1</LI>

<LI>Пункт 1.2</LI>

</OL>

<LI>Пункт 2

<LI>Пункт 2.1</LI>

<LI>Пункт 2.2</LI>

</OL>

<LI>Пункт 3

<LI>Пункт 3.1</LI>

<LI>Пункт 3.2</LI>

<LI value=”10”>Пункт 3.3</LI>

</OL>

</UL>

Сохранить внесенные в документ изменения и открыть файл для просмотра в браузере – Файл/ Сохранить, а затем двойной щелчок по файлу list.htm в месте его сохранения.