09. Кодирование списков
На этой странице:
HTML позволяет задавать на страницах списки двух типов
нумерованный и маркированный. Кроме того, каждый
пункт списка может иметь подчинённый, вложенный список.
Примеры маркированного и нумерованного списков:
Маркированный список |
Нумерованный список |
Вопросы Пятачка
- Какой он, этот Слонопотам?
- Неужели очень злой?
- Идёт ли он на свист? И если идёт, то зачем?
- Любит ли он поросят или нет?
- И как он их любит?
|
Словечки Эллочки
- Хамите.
- Хо-хо!
- Знаменито.
- Мрачный.
- Мрак.
- Жуть.
|
Маркированный список
Каждый элемент маркированного списка браузер предваряет меткой
(маркером списка), а сами элементы смещает вправо.
Элемент UL, задающий маркированный список, записывается в
следующем виде:
Конечный тег </LI> является необязательным.
Вид маркера, помещаемого браузером перед каждым элементом списка,
настраивается при помощи атрибута type. Этот атрибут может
отсутствовать или принимать одно из трёх значений:
Начальный тег |
Вид |
Описание |
<UL> |
|
Обычно круг (зависит от браузера) |
<UL type=circle> |
|
Окружность |
<UL type=disc> |
|
Круг |
<UL type=square> |
|
Квадрат |
Нумерованный список
В нумерованных списках каждый элемент снабжён номером, вид и
начальное значение которого настраиваются с помощью специальных
атрибутов.
Нумерованный список задается элементом OL:
Конечный тег </LI> является необязательным.
Вид номера определяется значением атрибута type:
Начальный тег |
Вид |
Описание |
<OL> |
|
Нумерация арабскими цифрами (1, 2, 3,
) |
<OL type=1> |
|
Нумерация арабскими цифрами (1, 2, 3,
) |
<OL type=A> |
|
Нумерация прописными буквами (A, B, C,
) |
<OL type=a> |
|
Нумерация строчными буквами (a, b, c,
) |
<OL type=I> |
|
Нумерация большими римскими цифрами (I, II, III,
) |
<OL type=i> |
|
Нумерация малыми римскими цифрами (i, ii, iii,
) |
Естественную нумерацию элементов списка (с единицы) можно изменить
при помощи атрибута start=n. Число n задает начальное значение
номера. Если для нумерации используются буквы или римские цифры, то
стартовое значение равно n-му элементу в системе нумерации (например,
n = 4 означает D или IV).
Браузеры делают фиксированный отступ для вывода элементов списка
на экран. Нумерация при этом смещается от отступа к левому краю окна.
Когда номер достаточно большой, места не хватает. Для исключения
этого неприятного эффекта в программе примера использован элемент
BLOCKQUOTE (увеличивает отступ).
Вложенные списки
Элемент любого списка сам может быть списком. Уровень вложенности, в
принципе, не ограничен, и это позволяет с успехом использовать списки
для отображения сложных иерархических структур.
Пример вложенных маркированных списков:
Пример вложенных нумерованных списков:
Пример смешанного списка элементы нумерованного списка содержат
вложенные маркированные списки:
О важности выравнивания элементов страницы уже говорилось.
Особенно неприятны нарушения выравнивания в списках, возникающие
из-за центрирования строк. Неприятные ощущения от таких конструкций в
несколько раз усиливаются присутствием списочных маркеров. Эти
маркеры словно точки на одной прямой хочется расположить красивым
вертикальным столбиком.
Посмотрите на такой список:
- волк;
- жираф великолепный;
- тигр учёный;
- лось сохатый.
А теперь на такой:
- волк;
- жираф великолепный;
- тигр учёный;
- лось сохатый.
Последний список получен центрированием. Разница заметна, правда?
|