Списки
В HTML є особлива група тегів - списки. Всі елементи цієї групи є блочними елементами.
Списки - це певний набір однотипних даних: перелік учнів чи книг, список новин, постів чи коментарів, список товарів на сторінці інтернет-магазину.
Бувають списки марковані (звичайні) <ul>, нумеровані (наприклад, список учнів в класі в алфавітному порядку) <ol> і список визначень <dl>.
Звичайні несортовані списки найпоширеніші, тому їх треба вивчити в першу чергу. На сайті списки використовуються для організації навігаційного меню, сторінкової навігації, кнопок соціальних мереж, банерів партнерів, товарів, змісту, переліку посилань, і просто як список чогось.
Батьківським елементом списку є тег <ul> або <ol>. Елементами списку виступають блоки <li>.
Список визначень складається з пар тегів <dt> та <dd>, що чергуються. Типові списки визначень - FAQ, список характеристик.
Приклад HTML-кода списків:
<ul>
<li>Сметана</li>
<li>Сир</li>
<li>Ковбаса
<ul>
<li>варена</li>
<li>копчена</li>
</ul>
</li>
<li>Хліб</li>
</ul>
<ol>
<li>Іванов П.С.</li>
<li>Петров С.І.</li>
<li>Сидоров І.П.</li>
</ol>
<h3>FAQ:</h3>
<dl>
<dt>Зламався ноут. Що робити?</dt>
<dd>Неси в сервісний центр.</dd>
<dt>Закрили файлообмінники, як бути?</dt>
<dd>Переходь на торренти.</dd>
<dt>Що робити якщо змерз?</dt>
<dd>Закутайся в пледик і пий чаї з імбирем, лимоном, малиною.</dd>
</dl>
<dl>
<dt>Процесор:</dt>
<dd>Intel Core i5</dd>
<dt>Пам'ять:</dt>
<dd>8 Gb DDR3</dd>
<dt>Вінчестер:</dt>
<dd>1 Тб HDD</dd>
</dl>
Увага! Ніякі інші елементи, включаючи <div>, <br>, <p> і т.д. не можуть знаходитися в тегах <ul>, <ol>, <dl> безпосередньо, тобто, бути безпосередніми доньками.
UL - Untyped List;
OL - Ordered List;
DL - Definition List;
LI - List Item;
DT - Definition Title
DD - Definition Description.