Як зробити список у списку. HTML-посібник для початківців

Як зробити список у списку. HTML-посібник для початківців

Сторінки веб-сайтів складаються з багатьох елементів - таблиць, картинок, посилань, медіафайлів, списків. Одним з найбільш затребуваних елементів є якраз-таки список. З його допомогою можна впорядкувати інформацію, подати її в більш стислому і зрозумілому вигляді, полегшити сприйняття. Саме тому слід знати, як в HTML зробити список і які види списків бувають. А також навчитися задавати необхідні параметри.

Види списків

Для початку виділимо основні види списків, з якими ми можемо працювати. Це впорядкований, неупорядкований і спадний списки.


Перший дозволяє нумерувати вміст за допомогою цифр і літер. Другий - це звичайне перерахування тих чи інших пунктів, третій же дозволяє вибрати з усього списку потрібний елемент.

Практично кожен з них може містити список у списку. HTML дозволяє легко створити складні переліки тієї чи іншої інформації за досить короткий час.

Перш за все визначіться, який зі списків вам потрібен, а потім приступайте до його створення. Нижче ми розглянемо всі три види списків і з 'ясуємо, як саме їх створювати і які параметри вони мають.

Впорядкований список

Почнемо з найбільш вживаного і поширеного списку - впорядкованого. У даному випадку перерахування тих чи інших відомостей йде в певному порядку, а кожен з елементів пронумерований. Наприклад, список класу:

  1. Іванов.
  2. Петров.
  3. Сидоров тощо.

Вказує список парних тегів < ol > і </ol >. Починається він з відкриваючого тегу < ol >, а закінчується тегом </ol >. Кожен новий елемент списку починається з парного тегу < li > і закінчується закриваючим </li >.

Тепер ви знаєте, як зробити список HTML. Як бачите, для цього достатньо запам 'ятати всього два теги.


Трохи про параметри тегу < ol > - type і start.

Перший визначає тип нумерації - буквений або цифровий. Може приймати такі параметри: A, a, I, i, 1.

Перші два значення задають нумерацію латинськими літерами - заголовними і рядковими, другі два - великими і маленькими римськими цифрами, останнє значення вживається, якщо ви хочете, щоб список був пронумерований арабськими цифрами.

Варто зазначити, що у списках за замовчуванням нумерація завжди задається за допомогою арабських цифр.

Другий параметр - start - визначає число, з якого і починається нумерація списку.

Скажімо також кілька слів і про параметри тегів < li >. У нього їх також два. Перший параметр value може змінювати порядок нумерації. Причому він буде змінений до того моменту, поки знову не буде прописаний даний параметр (або ж до кінця всього списку).

Другий параметр - type - допоможе змінити тип нумерації для цього пункту. Досить часто зустрічається варіант складного списку. Наприклад, візьмемо приблизний план твору:

  1. Вступ.
  2. Основна частина.
    а) думка інших;
    в) моя думка;
    с) докази.
  3. Висновки.

Створити такий список у списку HTML досить просто. Достатньо написати один основний список, а потім створити в потрібному місці другий з підпунктів, використовуючи іншу нумерацію. Ось приклад коду, заснований на нашому списку:


  • <ol type= «1»>.
  • <li>1. Вступ </li >.
  • <li>2. Основна частина </li >.
  • </ol type= «А»>
  • < li > думка інших </li >.
  • < li > моя думка </li >.
  • < li > докази </li >.
  • </ol>.
  • <li>3. Висновки </li >.
  • </ol>.

Неупорядкований список