Списки в HTML. Многоуровневое меню

Для того, чтобы упорядочить и систематизировать объемный текст используют списки. Они делают текст более читабельным. Списки бывают маркированными и нумерованными.

Списки в HTML. Многоуровневое меню

Для того, чтобы упорядочить и систематизировать объемный текст используют списки. Они делают текст более читабельным. Списки бывают маркированными и нумерованными. Для того, чтобы добавить маркированный список, используют тег <ul>, для добавления нумерованного списка <ol>. После открытия тегов <OL > или <UL >, добавляют элементы списков -<li>. Именно в эти элементы и добавляют текст, изображения, ссылки.

<ul> <li>Ячейка маркированного списка 1</li> <li>Ячейка маркированного списка 2</li>
<li>Ячейка маркированного списка 3</li>
</ul>
<ol> <li>Ячейка нумерованного списка 1</li> <li>Ячейка нумерованного списка 2</li>
<li>Ячейка нумерованного списка 3</li>
</ol>
  • Ячейка маркированного списка 1
  • Ячейка маркированного списка 2
  • Ячейка маркированного списка 3
    1. Ячейка нумерованного списка 1
    1. Ячейка нумерованного списка 2
    1. Ячейка нумерованного списка 3

Элементы маркированного и нумерованного списка имеют стандартные маркеры и нумерацию . Но это можно исправить, путем добавления атрибутов. Маркированный список имеет следующие атрибуты:

<ul> <li type="square">У устанавливает маркер в виде закрашенного квадрата</li>
<li type="round">У устанавливает маркер в виде закрашенного круга</li>
<li type="circle">У устанавливает маркер в виде не закрашенного круга</li>
</ul>
    • У устанавливает маркер в виде закрашенного квадрата
    • У устанавливает маркер в виде закрашенного круга
    • У устанавливает маркер в виде не закрашенного круга

У нумерованного списка также можно поменять нумерацию, используя следующие атрибуты:

<ol> <li type="A">Нумерация будет производиться большими буквами английского алфавита</li>
<li type="a">Нумерация будет производиться малыми буквами английского алфавита</li>
</ol>
    1. Нумерация будет производиться большими буквами английского алфавита
    1. Нумерация будет производиться малыми буквами английского алфавита

Также можно изменить начло отсчета у нумерованного списка. Причем начло отсчета можно изменить и с атрибутами type=»a» и type=»A»

<ol type="a" start="4">
<li>Ячейка 1</li>
<li>Ячейка 2</li>
<li>Ячейка 3</li>
</ol>
    1. Ячейка 1
    1. Ячейка 2
    1. Ячейка 3

И в завершении урока изучим многоуровневые списки. Обычно они используются для создания меню сайта.

<ul>	<li>просто текст</li>
<li>Вставим ещё 1 контейнер	<ol>
<li>Внутренний ли 1</li>
<li>Внутренний ли 2</li>	</ol>	</li>
</ul>
    • просто текст
    • Вставим ещё 1 контейнер
        1. Внутренний ли 1
        1. Внутренний ли 2

Теперь вы умеете создавать маркированные и нумерованные списки, а также многоуровневое меню.

Похожие записи:
Сервисы для заработка на просмотре сайтов
Сервисы для заработка на просмотре сайтов

Заработок на просмотре сайтов -это самый простой из тысячи способов заработать Подробнее:

Формы часть 2 (select,textarea,button)
Формы часть 2 (select,textarea,button)

По окончанию этого урока мы сделаем форму оформления покупки. Но Подробнее:

Формы часть 1. Теги input и form
Формы часть 1. Теги input и form

Вводный урок обучения формам обратной связи. Формы на сайте – Подробнее:

Таблицы в HTML
Таблицы в HTML

В этом уроке изучим на первый взгляд сложную а на Подробнее:

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *