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

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

види списків

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

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

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

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

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

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

Відео: HTML5 уроки для початківців | # 7 - Як створити списки в HTML

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

Здається такий список з допомогою парних тегів

і

. Починається він з відкриває тега

, а закінчується тегом

. Кожен новий елемент списку починається з парного тега

і закінчується закриває

.

Відео: CSS3 для початківців | # 10 Створення горизонтального меню

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

Трохи про параметри тега

- typeіstart.

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

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

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

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

Скажімо також пару слів і про параметри тега

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

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

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

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

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

Відео: Уроки HTML 3.2 Як зробити список

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

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

Відео: Як створити список в html

Здається даний список за допомогою парного тега

і

. При цьому кожен новий елемент починається з усе того ж парного тега.

Має всього один параметр - type, за допомогою якого задається тип маркера. Маркер може бути кружечком - зафарбовані чи ні, а також зафарбовані квадратом. Так, зафарбований круг має значення disc, зафарбований - circle. Квадрат задається за допомогою square.

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

Випадаючий список

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

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

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

Сам список задається за допомогою парних тегів .

Кожен новий елемент починається з парного тега .

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

висновки

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

Увага, тільки СЬОГОДНІ!