учебник. Учебник. Методические указания по выполнению лабораторнопрактического цикла для студентов очной и заочной формы обучения направления Прикладная информатика
 Скачать 1.91 Mb.
|
|
37 Упражнение 14 1. Запустите программу Блокнот. 2. Наберите в окне редактора текст файла HTML: 38 ЛАБОРАТОРНАЯ РАБОТА № 5 1. Используя полученные вами знания, создайте форму. 2. Форма должна содержать все ранее описанные элементы управления. 3. Тему и оформление задайте самостоятельно. 4. Пример формы приведен на рис. 21. Рис. 21. Пример формы «Анкета» ИЗОБРАЖЕНИЯ-КАРТЫ Изображение-карта – это обычное изображение с наложенной на него картой активных областей. Для создания карты применяется элемент MAP (задается парными тэгами < MAP >). Обычно для элемента MAP задается значения атрибута name – имя, которое используется для ссылок на созданную карту. 39 Внутри элемента MAP при помощи одиночных тегов зада- ются активные области карты. Для каждого элемента AREA могут зада- ваться следующие атрибуты: – coords – координаты активной области (количество и значение зависят от типа области, заданного атрибутом shape); – href – URL, на который указывает гиперссылка, ассоциированная с областью; – nohref – булев атрибут, создает неактивную область (с областью ас- социируется пустая гиперссылка); – shape – задает тип области, может принимать значения: rect (пря- моугольник), circle (круглая область), poly (многоугольник) и default (по умолчанию используется вся область карты); – alt – альтернативный текст; – title – текст подсказки (отображается в виде всплывающей подсказки при наведении указателя мыши на область). Если для атрибута shape установлено значение rect, то атрибуту coords задаются координаты верхнего левого и нижнего правого углов прямоугольника (например, coords = “10,10,34,45”). Если для атрибута shape установлено значение poly, то атрибуту coords задаются координаты всех вершин многоугольника. При этом лучше координаты первой вершины указать и в конце, в случае, если разработчики браузера забыли сделать автоматическое закрытие многоугольника (напри- мер, cords = “10,10,34,45,50,20,10,10” – задание треугольной области). Если для атрибута shape установлено значение circle, то атрибуту coords задаются координаты центра и радиус окружности (например, coords = “100,100,45”). Задание координат для создания горячих областей приведены на рис. 22. Рис. 22. Изображение координат для создания горячих областей 40 Упражнение 15 1. В программе Paint (в левом верхнем углу) создайте прямоугольник, проведите в нем диагонали. 2. Сохраните рисунок под именем прямоугольник. 3. В программе Блокнот создайте HTML- документ: 41 4. Сохраните файл под именем «Упражнение 15.html». Загрузите свой документ. На экране вы увидите результат своей работы, изображен- ный на рис. 23. Рис. 23. Изображение – карта ЛАБОРАТОРНАЯ РАБОТА № 6 1. Используя полученные вами знания, создайте изображение-карту. 2. Тему и оформление задайте самостоятельно. 3. Пример приведен на рис. 24. Рис. 24. Пример оформления карты с горячими областями 42 Список использованной литературы 1. Информационные технологии [Текст]: учеб. пособие / Е.Л. Румян- цева, В.В. Слюсарь. М.: ФОРУМ: ИНФРА-М, 2009. 256 с.: ил. 2. Использование HTML, JavaScript и CSS. Руководство Web – дизай- нера [Текст] / О.Н. Рева. М.: Эксмо, 2008. 464 с. 3. HTML. Популярный самоучитель [Текст] / А.А. Чиртик. СПб.: Пи- тер, 2006. 224 с.: ил. 4. HTML. Просто, как дважды два. [Текст] / О.Н. Рева. М.: Изд-во Эксмо, 2007. 256 с.: ил. 43 Оглавление Введение ........................................................................................................... 3 Базовые понятия ............................................................................................... 5 Структура HTML-документа .......................................................................... 5 Заголовок документа ..................................................................................... 6 Упражнение 1 ............................................................................................ 6 Определение тела документа........................................................................ 7 Особенности ввода текста ............................................................................... 8 Задание шрифта текста ................................................................................. 9 Упражнение 2 ............................................................................................ 9 Запрет разрыва строки ................................................................................ 10 Упражнение 3 .......................................................................................... 11 Заголовки ........................................................................................................ 12 Упражнение 4 .......................................................................................... 12 Специальные символы ................................................................................... 13 Лабораторная работа № 1 .............................................................................. 13 Списки ............................................................................................................ 14 Нумерованные списки ................................................................................ 14 Упражнение 5 .......................................................................................... 15 Маркированные списки .............................................................................. 16 Упражнение 6 .......................................................................................... 16 Многоуровневый ......................................................................................... 16 Упражнение 7 .......................................................................................... 17 Лабораторная работа № 2 .............................................................................. 18 Гиперссылки ................................................................................................... 19 Простой переход к ресурсам ...................................................................... 19 Навигация между HTML-документами ..................................................... 19 Упражнение 8 .......................................................................................... 19 Графика на Web-страницах ........................................................................... 21 Упражнение 9 .......................................................................................... 21 Линейки ....................................................................................................... 22 44 Упражнение 10 ........................................................................................ 22 Изображения-гиперссылки ......................................................................... 23 Упражнение 11 ........................................................................................ 23 Таблицы .......................................................................................................... 24 Заголовок таблицы ...................................................................................... 25 Параметры отображения таблицы ............................................................. 25 Слияние ячеек ............................................................................................. 26 Параметры отображения строк таблицы ................................................... 26 Лабораторная работа № 3 .............................................................................. 26 Фреймы ........................................................................................................... 27 Целевой фрейм отдельных гиперссылок ................................................... 28 Упражнение 12 ........................................................................................ 29 Лабораторная работа № 4 .............................................................................. 30 Элемент NOFRAMES.....................................................................................31 Формы ............................................................................................................. 31 Создание формы .......................................................................................... 31 Стандартные элементы управления ........................................................... 32 Многострочное текстовое поле .................................................................. 34 Списки ......................................................................................................... 34 Упражнение 13 ........................................................................................ 35 Упражнение 14 ........................................................................................ 37 Лабораторная работа № 5 .............................................................................. 38 Изображения-карты ....................................................................................... 38 Упражнение 15 ........................................................................................ 40 Лабораторная работа № 6 .............................................................................. 41 Список использованной литературы............................................................. 42 45 Е.В. Кох ОСНОВЫ HTML Екатеринбург 2010 |