Лекция: Нумерованный список
Для создания нумерованного списка применяется контейнер <ol>…</ol>, внутри которого располагаются теги<li>. В нумерованных списках каждый элемент снабжен номером, вид и начальное значение которого определяются атрибутом type. Его возможные значения приведены в таблице 2.
Таблица 2 – Типы нумерованных списков
| Тип списка | Код HTML | Пример |
| Нумерованный список с арабскими цифрами | <ol type=1> <li>...</li> </ol> | 1. Информация 2. Software 3. Hardware |
| Нумерованный список с прописными буквами латинского алфавита | <ol type=A> <li>...</li> </ol> | A. Информация B. Software C. Hardware |
| Нумерованный список со строчными буквами латинского алфавита | <ol type=a> <li>...</li> </ol> | a. Информация b. Software c. Hardware |
| Нумерованный список с римскими цифрами в верхнем регистре, начинающийся с семи | <ol type=I start=7> <li>...</li> </ol> | VII. Информация VIII. Software IX. Hardware |
| Нумерованный список с римскими цифрами в нижнем регистре | <ol type=i> <li>...</li> </ol> | i. Информация ii. Software iii. Hardware |
Атрибут value отменяет предыдущий порядок нумерации и устанавливает новый номер или букву. Например, <li value=5> задает нумерацию, начиная с пяти.
Несмотря на то, что концевые теги </li> определены, использовать их совершенно не обязательно, даже нежелательно.
Практическое задание к вопросу: «Основные теги для создания маркированных и нумерованных списков в HTML-документе. Примеры использования».
1. Выберите все типы списков, которые можно создавать в HTML-документе:
A) пользовательский;
B) нумерованный;
C) список атрибутов;
D) маркированный;
E) список определений;
F) упорядоченный.
2. Какой тег используется для оформления маркированного списка?
| A) <dl> | C) <ol> | E) <li> |
| B) <dt> | D) <ul> | F) <tt> |
27. Структура пользовательской формы. Основные теги для создания элементов управления формой в HTML-документе. Примеры использования.
На web-страницах часто встречаются всевозможные тесты, опросы, голосования. Для того, чтобы все это сделать на своих web-страницах и нужны формы.
Для создания формы применяется тег-контейнер <form></form>.
Внутри тега <form> могут размещаться элементы управления (текстовое поле, кнопки, переключатели, флажки, выпадающие списки и др.), которые создаются одиночным тегом <input>.
Пример формы с флажками
Пример формы с переключателями
Практическое задание к вопросу: «Структура пользовательской формы. Основные теги для создания элементов управления формой в HTML-документе. Примеры использования».
- Для создания формы используется тег-контейнер:
| A) <form></form> | C) <title></title> |
| B) <table></table> | D) body></body> |
2. Элементы управления в форме создаются с помощью одиночного тега:
| A) <caption> | C) <input> |
| B) <select> | D) <form> |
28. Вставка рисунков в HTML-документ. Основные теги. Примеры использования.
Предназначенные для web-страниц изображения можно создавать и редактировать в различных графических редакторах. Наиболее предпочтительны графические форматы GIF, JPG и PNG, файлы которых имеют небольшие размеры, что позволяет ускорить процесс загрузки.
Все изображения, которые мы видим на web-странице, хранятся в отдельных файлах, а в HTML-коде имеются лишь ссылки на них. Для отображения рисунков предназначен непарный тег <img>. Его неотъемлемым атрибутом является имя графического файла <img src=«имя_файла»>. Web-страницы и файлы с изображениями могут храниться в разных папках, тогда в атрибутеsrc тега <img> необходимо указывать путь.
Тег <img> может содержать и другие атрибуты (ширина и высота рисунка в пикселях, рамка вокруг картинки и т. д.), которые определяют способ отображения рисунка.
Практическое задание к вопросу: «Вставка рисунков в HTML-документ. Основные теги. Примеры использования».
1. В каком обязательном атрибуте тега <img> указывается имя графического файла в языке разметки гипертекста HTML?
A) title;
B) src;
C) align;
D) vspace.
2. Выберите все форматы графических файлов, которые наиболее предпочтительны при создании web-страниц:
A) bmp;
B) gif;
C) png;
D) txt;
E) jpg;
F) doc.
29. Основные возможности языка разметки гипертекстовых страниц HTML для создания дополнительных связанных web-страниц. Гиперссылки. Структура HTML-приложения.
Для создания ссылки необходимо сообщить браузеру, что является ссылкой, а также указать адрес документа, на который следует сделать ссылку. Оба действия выполняются с помощью парного тега <А> … </А> с обязательным атрибутом href, значением которого является адрес (URL) ресурса. Адрес ссылки может быть абсолютным и относительным. Абсолютные адреса работают везде и всюду независимо от имени сайта или веб-страницы, где прописана ссылка.
Относительные ссылки построены относительно текущего документа или адреса.
С помощью ссылок можно перейти на определенное место достаточно длинной страницы.
Обычно браузер устанавливает цветовое оформление ссылок по умолчанию. Можно изменить эти настройки специальными атрибутами тега <BODY>(по умолчанию цвет неактивированных ссылок – синий, активной ссылки – красный, цвет уже посещенных ссылок – фиолетовый).