Применение маркированного и нумерованного списков



Рисунок 2.9. Применение маркированного и нумерованного списков


Результат показан на Рисунок 2.9. Как видите, мы здесь не употребляли закрывающий тег </LI> . Броузер обычно все равно понимает, где кончается элемент списка, поскольку после любого элемента стоит либо тег следующего элемента <U> , либо тег завершения списка </UL> или </OL>.

Другой вопрос, что будет, если код написан некорректно: например, указаны теги <LI> без тега списка <OL> или <UL> , или в списке есть элементы без тега <LI> ?

Вообще говоря, такого допускать не следует, так как некоторые “строгие” браузеры в этом случае не будут отображать практически ничего. Большинство популярных броузеров, правда, попытаются угодить даже автору странички, написавшему такой код. Например, Internet Explorer 5, если встретит теги <LI> без тега начала списка, интерпретирует их как маркирован ный список, хотя и не будет выделять его отступом, а не помеченные тегом <LI> элементы списка оставит без маркера. Однако, повторяю, это из ряда вон выходящие случаи.

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

<UL>

<UL>

<UL>

</UL>

</UL>

</UL>

Разумеется, отступы здесь обозначены только для наглядности — чтобы не перепутать, какой закрывающий тег к какому открывающему тегу относится. Далее, при вложении нескольких маркированных списков хочется каждый из них обозначить своим типом маркера. Некоторые броузеры так и делают по умолчанию. Например, Internet Explorer элементы первого списка из серии вложенных обозначает закрашенным кружком, элементы второго — незакрашенным кружком, а элементы всех следующих — квадратиком. Однако, во-первых, так поступают не все броузеры, а во-вторых, нам может захотеться изменить порядок маркеров. Для явного определения типа маркера в теге <UL> следует установить атрибут TYPE=. У него могут быть три значения: "disc", "square" и "circle", что означает, соответственно, закрашенный кружок, квадратик и незакрашенный кружок.

В теге нумерованного списка <OL> можно установить атрибут TYPE= для определения типа нумерации. Если не указано ничего или установлено значение TYPE="1", то нумерация происходит обычными цифрами. Если установить TYPE="I" или "i", то получится нумерацию римскими цифрами (соответственно, с использованием прописных или строчных букв).

И, наконец, для буквенных обозначений элементов списка устанавливают атрибут TYPE="A" или "а". Кроме того, иногда может потребоваться начать нумерацию не с единицы, а с какого-нибудь иного числа. Для этого существует атрибут START=. Например, запись <OL START="43"> вызовет нумерацию элементов списка, начиная с числа 43. Далее пойдут элементы с номерами 44, 45 и т. д.

Может возникнуть естественный вопрос: а как использовать другие типы маркеров списков — разнообразные галочки, цветные кружки и прочие, которые мы так часто видим в WWW,? Действительно, такая возможность есть, однако мы рассмотрим ее несколько позже, в разделе Si.3. А пока приведем пример веб-странички фирмы “Лентяй” с использованием вложенных списков:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<head>

<title>Фирма "ЛЕНТЯЙ"</title>

</head>

<body BGCOLOR="#D2FFFF" TEXT="#003737" LINK="#006A6A"

VLINK="#006A6A" ALINK="#006A6A">

<DIV ALING="center"><H1>Фирма &laquo;ЛEHTЯЙ&raquo;</H1></DIV>

 <FONT SIZE="+l">Haшa фирма предоставляет следующие услуги:

</FONТ>

<UL TYPE="disc">

<LI>Бытовые услуги

<UL TYPE="square">

<LI>Вкручивание электрических лампочек

<LI>Услуги по наведению чистоты

<UL TYPE="circle">

<LI>Подметание пола

<LI>Вынесение мусора из квартиры

<LI>Мытье посуды

</UL>

</UL>

<LI>Приготовление пищи

<LI>Компьютерные услуги

<UL TYPE="square">

<LI>Дефрагментация жестких дисков

<LI>Переустановка Windows

</UL>

</UL>

<FONT SIZE="+1">Для того, чтобы воспользоваться нашими услугами,

следует:</FONT>

<OL>

<LI>Зарегистрироваться

(<A HREF="reg.html">здесь</A>)

<LI>Заполнить форму заказа

(<A HREF="forml.htm1">здесь</А>)

<LI>Пoдтвepдить заказ:

<OL TYPE="I">

<LI>Получив письмо с паролем подтверждения, послать пустой ответ,

нажав "Reply"

<LI>Заполнить форму-подтверждение заказа

(<A HREF="form2.html">здесь</A>)

</OL>

<LI>Приготовить деньги для оплаты услуг

</OL>

</body>

</html>

Результат показан на рис .2.10. Между прочим, при желании можно изменить вид маркера даже у отдельного элемента списка. Для этого следует установить атрибут TYPE= у тега <LI> . Однако это не будет смотреться очень хорошо, за исключением специальных случаев.

Мы пока намеренно не приводим примеры того, что могло бы быть в файлах reg.html, form! .html и form2.html, на которые есть ссылки в этом примере. Списки определений

Теперь давайте рассмотрим совершенно иной пример. Допустим, у нас уже есть сайт, на котором используется довольно много терминов, и мы хотим сделать отдельную страничку, поясняющую их. Давайте попробуем организовать такую страничку-словарь, а заодно рассмотрим еще один вид HTML-списка. Кстати, впоследствии мы вполне сможем использовать эту страничку как шаблон для своего словаря терминов.

Итак, нам необходима страничка, организованная, как словарик. Это значит, что в ее начале целесообразно расположить алфавит, чтобы читатель, щелкнувший на какой-либо букве, мог тотчас попасть на соответствую-



Содержание Назад Вперед