Списки.

· Маркіровані списки

· Нумеровані списки

· Вкладені списки

· Списки визначень

· Вправа

Марковані списки

Марковані списки - це списки, в яких елементи списку є маркерами.
Для установки маркірованого списку використовуються теги <ul> і <li>

Тег <ul> - unordered list (неврегульований список).
Тег <li> - list item (елемент списку)

Код, написаний таким чином

<ul>
<li> Книги </li>
<li> Електроніка </li>
<li> CD і DVD </li>
</ul>

відображуватиме на екрані так:

Маркери можуть приймати один з трьох видів: круг (за умовчанням), коло і квадрат. Для вибору типа маркера використовується параметр type=... тега <ul>.

За допомогою CSS можна задати як маркер будь-яке зображення. В цьому випадку слід пам'ятати: при масштабуванні тексту при перегляді в браузері стандартні маркери масштабуються разом з ним, а зображення, використовувані як маркер, не масштабуються.

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

Нумеровані (або впорядковані) списки є списками з пронумерованих пунктів.
Для установки нумерованого списку використовується тег <ol> замість <ul>
Тег <ol> - ordered list (впорядкований список).

Найпростіший список має наступний код:

<ol>
<li> Вийдете на станції метро Войковськая. </li>
<li> Сядьте на тролейбус 57 маршруту.</li>
<li> Вийдете на четвертій зупинці. </li>
<li> Перейдіть дорогу. Я Вас чекатиму в кіоску.</li>
</ol>

На екрані він відображуватиметься так:

1. Вийдете на станції метро Войковськая. 2. Сядьте на тролейбус 57 маршруту. 3. Вийдете на четвертій зупинці. 4. Перейдіть дорогу. Я Вас чекатиму в кіоску.  

Вигляд і тип нумерації залежить від параметрів тега <ol>

Код HTML	Відображення на екрані
<ol start="5">	Список починається з пяти: 5. Желтий 6. Синій 7. Червоний
<ol type="A">	Заголовні латинські букви: A. Жовтий B. Синій C. Червоний D.
<ol type="a">	Прописні латинські букви: a. Жовтий b. Синій c. Червоний d.
<ol type="I">	Cписок з римськими буквами: I. Жовтий II. Синій III. Червоний IV.

Вкладені списки

Вкладений список - це список, розміщений усередині іншого списку.

Наприклад, код

<ol>
<li> Крупні міста Росії:
<ul type="square">
<li> Москва
<li> Санкт-Петербург
</ul>
<li> Крупні міста України:
<ul type="square">
<li> Київ
</ul>
</ol>

відображуватиметься на екрані так:

1. Крупні міста Росії: § Москва § Санкт-Петербург 2. Крупні міста України: § Київ §

Дата добавления: 2015-10-02