Списки в HTML

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

Існує два основних види списків в HTML: нумерований і маркований. Третій тип — список для визначень, який зустрічається доволі рідко.

 

 

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

 

У нумерованому списку біля кожного елемента списку проставляється номер.

Наприклад, щоб створити такий список:

  1. Одягнути спортивну форму
  2. Узяти м’яч
  3. Зібрати друзів
  4. Зіграти футбол

треба написати такий код:

<ol>

<li> Одягнути спортивну форму </li>

<li> Узяти м’яч </li>

<li> Зібрати друзів </li>

<li> Зіграти футбол </li>

</ol>

Розберемся з структурою. Тег <ol> означає початок списку, а тег <li> новий елемент.  Для тегу нумерованного списку <ol> можна застосовувати декілька атрибутів, зокрема, start(номер з якого буде починатись наша нумерація) і type( вказує тип нумерації і може мати такі значення — 1, A, a, I, i).

<ol start=3 type=A>

<li> Одягнути спортивну форму </li>

<li> Узяти м’яч </li>

<li> Зібрати друзів </li>

<li> Зіграти футбол </li>

</ol>

Модифікувавши код, ми вказали, що тип нумерації мусить бути буквенний і починатися з 3 символа, тобто букви C, ось що ми отримали:

 

C.Одягнути спортивну форму

D.Узяти м’яч

E.Зібрати друзів

F.Зіграти футбол

 

 

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

 

У маркованому списку порядок елементів не має такої ролі, як у нумерованому. Біля елементів проставляються спеціальні значки(точки, сфери, квадрати).

Перед наведенням прикладу, скажу що список це має атрибут type(від якого саме і залежить тип значка), який набуває значень disc(по замовчуванні, відображає зафарбований круг), square(зафарбований квадрат), circle(незафарбований круг).

<ul type=square>

<li>Сходити в кінотеатр</li>

<li>Зустріч з друзями</li>

<li>Гра у пейнтбол</li>

</ul>

Щоб створити маркований список використовуєм тег <ul>.

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

n

 

Чекаю ваших відгуків і побажань щодо уроків! Щасти!