Списки в тексте, как их создавать и использовать в документе.

Данный урок посвящен важной теме html языка, а именно html списки. Как Вы наверняка уже видели в интернете, спискибывают не упорядоченные (перед пунктами в списке стоит точка, ромб или какая-то картинка) и упорядоченные (пункты списка нумеруются всякого рода цифрами или буквами). Вот в этом разница списков, давайте перейдем непосредственно к элементам языка html тегам для списков:

- UL	Тег для создания неупорядоченного списка
- OL	Тег для создания упорядоченного списка
- LI	Тег для создания пунктов в списках OL или UL

UL – тег предназначен для создания неупорядоченного списка, данный тег обязательно нужно закрывать! Так же для обозначения элементов списка нужно применять еще один тег LI. Этот тег указывает пункты списка.

Код html:

<ul> <li>Первый пункт для списка </li> <li>Второй пункт </li> <li>Третий</li> <li>Четвертый пункт, можно продолжить перечисление если нужно </li> </ul>

Выглядит это примерно так:

OL – Этот тег предназначен чтобы создавать упорядоченные списки. Как и в предыдущим примере, обязательно нужно использовать тег LI для обозначения пунктов списка.

Атрибуты:

START – данный атрибут устанавливает число, с которого будет начинаться нумерация списка. Использовать можно только целые числа. Атрибут не обязательный, если его не указывать, то список начнет нумероваться с начала.

TYPE – с помощью этого атрибута можно указать как нумеровать список (цифры, буквы и тд..)

Тег может принимать значения:

"1" – арабские числа 1, 2, 3 ... "A" – буквы заглавные A, B, C ... "a" – буквы маленькие a, b, c ... "I" – римские числа заглавные I, II, III ... "i" – римские числа обычные i, ii, iii ...

По умолчанию стоит нумерация арабскими цифрами.

Пример html кода:

<!-- арабскиме числа --> Чтобы создать свой сайт самому нужно: <ol type="1" > <li> Изучить html </li> <li> Изучить css </li> <li> Желательно выучить  php </li> </ol> <!-- большие римские числа --> Для удобства и скорости создания сайта нужно знасть: <ol type="I" > <li> Adobe Dreamweaver </li> <li> TOpStylePro </li> <li> Photoshop </li> </ol> <!-- маленькие буквы --> Для заработка на сайте нужно: <ol type="a" > <li> повысить посещаемость сайта </li> <li> монетизировать сайт </li> <li> оптимизировать рекламу </li> </ol> <!-- устанавливаем номер начала нумирации --> Веб мастер должен: <ol type ="1" start="2" > <li> писать статьи для сайта </li> <li> постоянно вести работы с сайтом </li> <li> знать кучу кучу всего </li> </ol>

Браузер обработает код так:

LI – Как Вы уже думаю поняли, данный тег нужен чтобы создавать пункты списка. Этот тег обязательно нужно закрывать и находиться он должен только между тегами OL или UL. Если не закрыть этот тег или поместить вне тегов для создания списка ничего страшного не случиться, но код нужно писать правильно и без ошибок. Иначе поисковые системы будут косо смотреть на сайт.

Атрибуты:

VALUE – атрибут позволяет изменить порядковый номер для нумерации списка. Атрибут можно использовать только всписках OL. Значение устанавливается в цифровом формате:

Чтобы создать сайт на домашнем компьютере необходимо: <ol ><!-- если не указан тип списка, используется нумерация цифрами --> <li> html выучить просто!</li> <!-- теперь присваиваем нумерацию с пятого пункта --> <li value="5"> css тоже не сложно выучить </li> <li> php простой язык, но требует усидчивости </li> </ol>

В браузере мы увидим:

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

Пример:

<ol>

<li> html выучить просто!</li>

<ol>

<li> пройти вводный курс!</li>

<li> закрепить на практике </li>

<li> делать свои сайты! </li>

</ol>

<li> css тоже не сложно выучить </li>

<li> php простой язык, но требует усидчивости </li>

</ol>

Итог: