|
||
Создание списков вручную - довольно утомительное занятие, особенно если в качестве маркера вы выбрали какой-нибудь символ или картинку. XHTML предоставляет нам автоматизированные способы создания списков, достаточно только вставить нужные теги на сайт.
В Web есть 3 вида списков: нумерованные, ненумерованные и списки определений.
Вначале о том, как создаются все списки в XHTML.
Упорядоченные списки создаются тегом <ol>.
Неупорядоченные списки создаются тегом <ul>.
Элементы списка создаются тегом <li>.
Пример:
<ol>
<li>Это 1 элемент упорядоченного списка</li>
<li>Это 2 элемент</li>
<li>Это 3 элемент</li>
</ol>
Вот что мы получим в браузере
Аналогично с ненумерованными списками
<ul>
<li>Это 1 элемент неупорядоченного списка</li>
<li>Это 57 элемент</li>
<li>Это 25 элемент :-)</li>
</ul>
Теги <ol> и <ul> поддерживают атрибут type, указывающий на способ отображения маркера. Для тега <ol> он может принимать такие значения:
Тип | Схема нумерации | Пример |
---|---|---|
1 | Обычные числа | 1,2,3..8,9... |
a | Строчные буквы(EN) | a, b, c... |
A | Заглавные буквы(EN) | A, B, C... |
i | Малые римские цифры | i,ii,iii,iv... |
I | Большие римские цифры | I,II,III... |
Атрибут type тега <ul> может принимать значения: disk(стандартный черный круг), circle(Белый круг с черной границей) и square(черный квадрат).
Тег <ol> также поддерживает атрибут start, который говорит браузеру, с какого номера начинать отсчет. Например:
<ol start="15">
<li>Это 15 элемент упорядоченного списка</li>
<li>Это 16 элемент</li>
<li>Это 17 элемент</li>
</ol>
Список определений - неупорядоченный список, где элемент состоит из двух частей - термина и его определения. Браузер отображает список определений так, что термин пишется слева на верхней строке, а его определение - справа на нижних строках. Пример можно посмотреть на странице Словарь.
Тег списка определений - <dl>. В него может вставляться неограниченное количество терминов-определений.
Пара термин-определение вставляется 4 тегами: термин заключен в теги <dt> и </dt>, а сразу после них идет определение термина в тегах <dd> и </dd>.
Пример:
<dl>
<dt>Термин</dt><dd>Определение</dd>
<dt>Другой термин</dt><dd>Определение другого термина</dd>
<dt>Etc.</dt><dd>Латинская фраза, означающая "и так далее"</dd>
</dl>
Вы легко можете создавать вложенные списки. Для этого всего лишь нужно поместить один список как элемент другого списка.
Есть еще хороший способ
uroki.webservis.ru