Студопедия

КАТЕГОРИИ:


Архитектура-(3434)Астрономия-(809)Биология-(7483)Биотехнологии-(1457)Военное дело-(14632)Высокие технологии-(1363)География-(913)Геология-(1438)Государство-(451)Демография-(1065)Дом-(47672)Журналистика и СМИ-(912)Изобретательство-(14524)Иностранные языки-(4268)Информатика-(17799)Искусство-(1338)История-(13644)Компьютеры-(11121)Косметика-(55)Кулинария-(373)Культура-(8427)Лингвистика-(374)Литература-(1642)Маркетинг-(23702)Математика-(16968)Машиностроение-(1700)Медицина-(12668)Менеджмент-(24684)Механика-(15423)Науковедение-(506)Образование-(11852)Охрана труда-(3308)Педагогика-(5571)Полиграфия-(1312)Политика-(7869)Право-(5454)Приборостроение-(1369)Программирование-(2801)Производство-(97182)Промышленность-(8706)Психология-(18388)Религия-(3217)Связь-(10668)Сельское хозяйство-(299)Социология-(6455)Спорт-(42831)Строительство-(4793)Торговля-(5050)Транспорт-(2929)Туризм-(1568)Физика-(3942)Философия-(17015)Финансы-(26596)Химия-(22929)Экология-(12095)Экономика-(9961)Электроника-(8441)Электротехника-(4623)Энергетика-(12629)Юриспруденция-(1492)Ядерная техника-(1748)

Упорядоченные списки




Неупорядоченные списки

Списки

В этой главе пойдёт речь о списках, которые могут быть:

· неупорядоченные(маркированные)

· упорядоченные (нумерованные)

· и являться списком определений

Такое вот нестандартное начало главы.. зато теперь Вам понятно, что есть список в html.

Ну что ж давайте пройдёмся по нашему списку.

Неупорядоченный список задаётся тегом <ul>. Любой список состоит из элементов, "пунктов", каждый элемент в свою очередь задаётся тегом <li> после которого собственно и идёт текст нужного нам "пункта". Для тега <li> закрывающий тег </li> необязателен.

Вместе данные теги приобретают следующий вид:

<ul>
<li> Пункт первый..
<li> Пункт второй..
<li> Пункт третий..

</ul>

Пример неупорядоченного списка:

<html>
<head>
<title>неупорядоченный список</title>
</head>
<body>
Купить и доставить домой:
<ul>
<li> 2 кг. клубней картофеля
<li> 1 булку ржаного чёрного хлеба
<li> пачку макарон "спагетти" (длинные не менее 200мм. тонкие)
<li> 1 кг. шлифованного риса (сложно объяснить.. спросишь..)
<li> 1 дес. куриных яиц.
<li> 1 пачку 500г. Натрия двууглекислого (Сода)
</ul>
Смотри ничего не перепутай.. целую..
</body>
</html>

Теги <li> и <ul> имеют атрибут type который присуждает элементу списка или же всему списку целиком определённый стиль.

Может иметь одно и трёх значений:

· disk- кружок, диск (по умолчанию)

o circle - полый круг

§ square - квадрат

Пример:

<html>
<head>
<title>стили неупорядоченного списка</title>
</head>
<body>
В этом списке каждый элемент имеет свой стиль:
<ul>
<li type="disk"> кружок, диск (по умолчанию)
<li type="circle"> полый круг
<li type="square"> квадрат
</ul>
А здесь стиль задан всему списку
<ul type="circle">
<li> Пункт 1
<li> Пункт 2
<li> Пункт 3
</ul>
</body>
</html>

Упорядоченный или нумерованный список задаётся тегом <ol>, так же как и в неупорядоченном списке, элемент списка присуждается тегом <li>.

Построение кода полностью схоже с неупорядоченным списком, поэтому сразу пример:

<html>
<head>
<title>упорядоченный список</title>
</head>
<body>
Купить товары в следующем порядке:
<ol>
<li> Водка
<li> Пиво
<li> Сырок (необязательно)
</ol>
Жду!!!
</body>
</html>

А вот атрибут type в сочетании с упорядоченным списком может иметь следующие значения:



· А - Заглавные буквы

· а - Строчные буквы

· I - Заглавные римские цифры

· i - Строчные римские цифры

· 1 - Арабские цифры (по умолчанию)

Вот пример их применения:

<html>
<head>
<title>Стили упорядоченного список</title>
</head>
<body>
Арабские цифры
<ol type="1">
<li>Во-первых
<li>Во-вторых
</ol>
Строчные буквы
<ol type="a">
<li>Во-первых
<li>Во-вторых
</ol>
Заглавные буквы
<ol type="A">
<li>Во-первых
<li>Во-вторых
<li>В-третьих
</ol>
Строчные римские цифры
<ol type="i">
<li>Во-первых
<li>Во-вторых
<li>В-третьих
<li>В-четвёртых
</ol>
Заглавные римские цифры
<ol type="I">
<li>Во-первых
<li>Во-вторых
<li>В-третьих
<li>В-четвёртых
</ol>
</body>
</html>

В упорядоченном списке есть ещё один атрибут start его числовое значение говорит о том с какого номера следует строить упорядоченный список.

Пример:

<html>
<head>
<title>Начало упорядоченного списка</title>
</head>
<body>
<ol type="1" start="24">
<li>Сразу переходим к двадцать четвёртому пункту!!
<li>Идём дальше
<li>И дальше
</ol>
Аналогично можно "стартовать" при любом стиле упорядоченного списка
<ol type="I" start="8">
<li>Сразу переходим к восьмому пункту..
<li>Идём дальше
<li>И дальше
</ol>
</body>
</html>





Дата добавления: 2014-10-31; Просмотров: 74; Нарушение авторских прав?;


Нам важно ваше мнение! Был ли полезен опубликованный материал? Да | Нет



ПОИСК ПО САЙТУ:





studopedia.su - Студопедия (2013 - 2017) год. Не является автором материалов, а предоставляет студентам возможность бесплатного обучения и использования! Последнее добавление ip: 54.224.102.26
Генерация страницы за: 0.023 сек.