«РОССИЙСКИЙ ГОСУДАРСТВЕННЫЙ УНИВЕРСИТЕТ ТУРИЗМА И СЕРВИСА» В Г. САМАРЕ
(ФИЛИАЛ ГОУ ВПО «РГУТИС» В Г. САМАРЕ)
Факультет
Кафедра Естественнонаучных дисциплин
Составитель Л.В. Овидиева
Изучение языка HTML
Практическое учебное пособие для студентов дневной и заочной формы обучения всех специальностей
Самара
Печатается по решению Учебно-методического совета Филиала ГОУ ВПО «РГУТиС» в г. Самаре (протокол № от )
Составитель: Любовь Владимировна Овидиева
Изучение языка HTML:Практическое учебное пособие/ сост. Л.В. Овидиева.- Самара: Филиал ГОУ ВПО «РГУТиС» в г. Самаре, 2010.- 77с.
Практическое учебное пособие направлено на изучение HTML-кодов и создания Web-страниц, которые являются виртуальными визитными карточками, средством общения, презентациями.
Пособие предназначено для начинающих Web-программистов.
Оглавление
Введение 8
Глава 1. Основные принципы HTML 9
Лабораторная работа №1: Курсив 9
Лабораторная работа №2: Жирный шрифт и подчёркивание 9
Задание 10
Глава 2. Абзацы 10
Лабораторная работа №1: Переход на новую строку 10
Лабораторная работа №2: Абзац с параметрами 11
Задание 12
Глава 3. Служебные и «непечатные» символы 13
Лабораторная работа №1: Специальные символы 13
Задание 13
Лабораторная работа №2: Переносы 13
Глава 4. Шрифты 15
Лабораторная работа №1: Гарнитура 15
Задание 15
Лабораторная работа №2: Размер 16
Задание 16
Лабораторная работа №3: Цвет 16
Задание 17
Лабораторная работа №4: Другие параметры 17
Глава 5. Фон 17
Задание 18
Глава 6. Заголовки 18
Лабораторная работа №1: Уровни заголовков 18
Лабораторная работа №2: Параметры заголовка 19
Задание 19
Глава 7. Логическая разметка гипертекста 20
Лабораторная работа №1: Расстановка акцентов 20
Лабораторная работа №2: Цитаты 21
Лабораторная работа №3: Верхние и нижние индексы 21
Лабораторная работа №4: Дескрипторы PRE и VAR 22
Лабораторная работа №5: Сокращения и обратный адрес. 23
Задание 24
Глава 8. Списки 24
Лабораторная работа №1: Нумерованные списки 24
Задание 25
Лабораторная работа №2: Маркированные списки 26
Задание 26
Лабораторная работа №3: Параметры элемента списка 26
Лабораторная работа №4: Многоуровневые списки 28
Задание 29
Глава 9. Графика на Web-странице 29
Лабораторная работа №1: Вставка графики в текст 29
Лабораторная работа №2: Размеры изображения и контекстная подсказка 30
Задание 31
Лабораторная работа №3: Обтекание графики текстом 31
Задание 33
Лабораторная работа №4: Выравнивание по вертикали 33
Задание 34
Лабораторная работа №4: Картина в рамке 34
Лабораторная работа №5: Отступы 35
Задание 35
Глава 10. Табличный дизайн 36
Лабораторная работа №1: Пример табличного дизайна 36
Задание 38
Лабораторная работа №2: Внутренние отступы 38
Задание 39
Лабораторная работа №3: Слияние и группировка ячеек 39
Задание 42
Глава 11. Фреймы 42
Лабораторная работа №1: Фреймовая структура 42
Лабораторная работа №2: Размеры фреймов 43
Задание 45
Лабораторная работа №3: Вложенные фреймы 45
Задание 46
Лабораторная работа №4: Обрамление и отступы 46
Задание 49
Лабораторная работа №5: Ссылки. Фрейм без фреймов 49
Задание 51
Глава 12. Формы 51
Лабораторная работа №1: Основная схема формы 51
Лабораторная работа №2: Текстовые строки 51
Лабораторная работа №3: Кнопки 54
Лабораторная работа №4: Текстовые поля 56
Лабораторная работа №5: Списки вариантов 57
Лабораторная работа №6: Списки переключатели 59
Лабораторная работа №7: Раскрывающиеся списки 60
Задание 62
Глава 13. Структура HTML-документа 62
Лабораторная работа №1: Основные параметры Web-страницы. Отступы от края окна 62
Задание 63
Лабораторная работа №2: Цвет фона и цвет текста 63
Задание 63
Глава 14. Внешние параметры Web-страницы 64
Лабораторная работа №1: Название Web-страницы 64
Глава 15. Основные принципы каскадных таблиц стилей 65
Лабораторная работа №1: Простейшее описание стиля. 65
Таблицы стилей. Стиль дескриптора 65
Задание 66
Лабораторная работа №2: Подклассы дескрипторов 66
Задание 68
Лабораторная работа №3: Задание фона и цвета текста 68
Задание 71
Лабораторная работа №4: Отступы и рамки 71
Задание 73
Глава 16. Понятие событий 73
Лабораторная работа №1: Виртуальные события 73
Лабораторная работа №2: События мыши 74
Лабораторная работа №3: События клавиатуры 76
Задание 76
Задание по пройденному материалу 76
Рекомендуемая литература. 77
Введение
HTML – язык гипертекстовой разметки, предназначен для разметки и оформления документов, публикуемых в WWW или, проще сказать, HTML – документов. Этот язык независим от платформы, т.е. может работать в любых операционных системах.
HTML - язык дескрипторов. Дескриптор – это некое ключевое слово или сокращение, которое служит признаком того или иного форматирования данной части документа. Дескриптор заключают между знаками «больше» и «меньше»: <ДЕСКРИПТОР>.
Многие дескрипторы принадлежат к контейнерному типу: в них, как в контейнер, заключается фрагмент текста, форматирование которого определяется этим дескриптором, - например, выделение курсивом и т.д. Такие дескрипторы всегда парные: каждому открывающему дескриптору <Дескриптор> соответствует закрывающий, причём закрывающий дескриптор начинается с косой черты </Дескриптор>.
Встречаются и неконтейнерные, одинарные дескрипторы. Они не содержат текста, который нужно так или иначе отформатировать, а определяют характеристики документа в целом или описывают объект, который нужно вставить в данной точке документа, например картинку. Такие дескрипторы не имеют закрывающих «двойников».
Контейнерные дескрипторы, как правило, могут быть вложенными друг в друга:
Текст 1 <дескриптор 1> текст 2 <дескриптор 2> текст 3 </дескриптор 2> текст 4 </дескриптор 1> текст 5.
Главное правило при использовании вложенных дескрипторов – соблюдать последовательность: первым закрывается дескриптор, открытый последним.
Вся работа ведётся в программе Блокнот. Файл сохраняется с расширением .html. А результат просматривается в броузере Internet Explorer.
