Создание списков
Тема 4: Создание списков (1 час)
План
1. Списки как инструмент структурирования. Типы списков
2. Нумерованные списки
3. Маркированные списки
4. Списки определений
5. Вложение и комбинирование списков
1. Списки как инструмент структурирования. Типы списков
Списки – это очень мощное средство структурирования документа. С их помощью можно обеспечить четкую и ясную подачу материала. В HTML предусмотрены возможности создания привлекательных и в то же время функциональных списков.
Рекомендуемые материалы
В HTML предусмотрены возможности создания различных типов списков. Причем каждый из них может использоваться как самостоятельно, так и в сочетании с другими типами списков.
Таблица – Типы списков HTML и соответствующие им дескрипторы
Дескриптор | Тип списка |
<OL> | Упорядоченный (нумерованный) список |
<UL> | Неупорядоченный список (маркированный) |
<DL> | Список определений |
<MENU> | Список элементов меню (используется редко) |
<DIR> | Список элементов каталогов (используется редко) |
2. Нумерованные списки
Упорядоченные и нумерованные списки – это одно и то же. Эти термины являются взаимозаменяемыми. Нумерованный список создается с помощью контейнера <OL></OL>. Каждый элемент списка определяется внутри этого контейнера с помощью дескриптора <LI> (который расшифровывается как list item- элемент списка).
По умолчанию элементы списка нумеруются с помощью обычных арабских цифр. Но можно сделать так, чтобы для нумерации использовались буквы алфавита (строчные или прописные) или римские цифры. Стиль форматирования списка определяется с помощью следующего синтаксиса:
<OL TYPE=тип>
Параметр тип может принимать значения, приведенные в таблице
Таблица – Типы нумерации упорядоченных списков в HTML
Тип | Стиль |
1 | Стандартный способ нумерации с помощью арабских цифр |
а | Строчные буквы алфавита |
А | Прописные буквы алфавита |
i | Строчные римские цифры |
I | Прописные римские цифры |
Способ нумерации можно изменить и в середине списка. Для этого соответствующий элемент списка нужно определить следующим образом:
<LI TYPE=тип>
Нумерацию списка с помощью цифр или букв можно начать с любой цифры или буквы. Для этого используется атрибут START.Чтобы начать нумерацию с некоторой буквы или римской цифры, воспользуйтесь атрибутами TYPE и START. Синтаксис этой процедуры выглядит следующим образом:
<OL TYPE=тип START=значение>
Параметр значение – это число.
Для изменения схемы нумерации внутри списка используется атрибут VALUE дескриптора <LI>.
3. Маркированные списки
Самым распространенным типом списка является неупорядоченный или маркированный список. В таких списках напротив каждого элемента неупорядоченного списка находится маркер (bullet), который может иметь вид, например, большого черного кружка или квадратика.
При создании маркированных списков используются дескрипторы <UL> и </UL>. Как и в нумерованных списках, все элементы маркированных списков определяются с помощью дескриптора <LI>.
Чтобы изменить тип маркера для всего списка, воспользуйтесь синтаксисом <UL TYPE=тип>, а для одного элемента списка – <LI TYPE=тип>, где параметр тип – это одно из значений, приведенных в таблице
Таблица – типы маркеров для маркированных списков
Тип | Рекомендуемый внешний вид (зависит от браузера) |
Disk | Заполненный кружок |
Square | Заполненный квадратик |
Circle | Незаполненный кружок |
4. Списки определений
Списки определений чем-то напоминают толковые словари, так как каждому термину соответствует абзац определения, расположенный с отступом. Это средство незаменимо в том случае, если нужно создать список элементов с их подробным описанием (например, для каталогов розничных товаров или недвижимости).
Список определений (definition list) содержится в контейнере <DL></DL>. Элементы списка определений создаются с использованием дескрипторов <DT> и <DD>, с помощью которых отмечаются термин и его определение соответственно.
5. Вложение и комбинирование списков
При желании можно комбинировать различные типы списков, а также вкладывать их друг в друга независимо от того, к одному или к разным типам они относятся.
В следующем листинге приведен пример использования вложения маркированного списка в нумерованный.
<HTML>
<HEAD>
<TITLE>Вложение списков</TITLE>
</HEAD>
<BODY BGCOLOR=#FF00FF>
<H1>Вложенные списки</H1>
<HR>
<H2>Как приготовить эликсир молодости</H2>
<OL>
<LI>Взять равные части следующих элементов:
<UL>
<LI>Крокодиловы слезы
<LI>От мертвого осла уши
<LI>Дырку от бублика
</UL>
<LI>Все перемешать и растолочь в порошок
<LI>Порошок залить спиртом
<LI>Полученную жидкость перелить в бутылку
<LI>Закопать бутылку в саду
Бесплатная лекция: "7. Пьезоэлектрические датчики" также доступна.
<LI>Выкопать ровно через 1 год
<LI>Выбросить бутылку в море и не морочить себе голову!
</OL>
<HR>
</BODY>
</HTML>