Рейтинг:  5 / 5

Звезда активнаЗвезда активнаЗвезда активнаЗвезда активнаЗвезда активна
 

Прошлый урок был посвящён оформлению текста в HTML документе.
Теперь рассмотрим такое понятие как списки HTML.

Списки в html бывают нумерованные и маркированные (непронумерованные).

Нумерованные списки: в начале строки ставится цифра или буква (номер строки). Маркированные списки (НЕпронумерованные): ставятся различные символы точки, ромбики, квадратики и т.д., они называются маркеры или буллеты ( bullet ).

 

UL

Создаёт маркированные (НЕпронумерованный) списки

OL

Создаёт пронумерованные списки

LI

Создаёт пункты (строки) внутри контейнеров <ul> и <ol>

 

 

Тэг UL (контейнер)

НЕпронумерованный список. Внутри контейнера обязательно должен быть хотя бы один пункт   (тэг <li>). Напрмер:

<ul>
<li>Аквариумы и оборудование</li>
<li>Пресноводные рыбки</li>
<li>Морские рыбки</li>
<li>Аквариумные растения</li>
<li>Другие обитатели</li>
</ul>

Вот что получится :

Списки в html

 

Тэг OL (контейнер)

Пронумерованый список. Также внутри контейнера должен находиться хотя бы один пункт списка.

Атрибуты тэга <ol>:

Атрибут type задаётстиль нумерации списка.

type="1" арабские числа 1,2,3 и т.д.

type="I" римские числа I,II,III и т.д.

type="A" заглавные буквы

type="a" строчные буквы.

По умолчанию (без атрибута) список начинается с арабских чисел.

Атрибут start определяет с какой цифры начинается список.
Например для значения start="3" список начнётся с цифры 3 и пойдёт по порядку 4, 5, 6 и т.д.

 

Приведу пример списка со строчными буквами:

<ol type="a">
<li>Аквариумы и оборудование</li>
<li>Пресноводные рыбки</li>
<li>Морские рыбки</li>
<li>Аквариумные растения</li>
<li>Другие обитатели</li>
</ol>

Получается вот что:

Списки в html

 

С контейнером <li> я думаю всё понятно. Он создаёт пункты списка.

Попробуйте немного потренироваться. Добавьте код в свой файл index.html перед закрывающим тэгом </body>.

 

Перейти к следующему уроку

Ссылки в HTML

Хотите быстро изучить HTML и CSS?
Тогда вам сюда >>

X

Инструкция по планированию сайта
С чего начать создание сайта?

Инструкция по созданию сайта

  • Инструкция по созданию сайта
  • Шаблон для составления плана сайта
  • Чек-лист по этапам создания сайта

* Никакого спама. Гарантирую!