- •Оглавление
- •Введение
- •Задание
- •Лабораторная работа №3: Разрыв строки
- •Кавычки.
- •Дефис и тире.
- •Глава 4. Шрифты
- •Лабораторная работа №1: Гарнитура
- •Задание
- •Лабораторная работа №4: Другие параметры
- •Лабораторная работа №2: Параметры заголовка
- •Задание
- •Глава 7. Логическая разметка гипертекста
- •Лабораторная работа №1: Расстановка акцентов
- •Лабораторная работа №2: Цитаты
- •Лабораторная работа №3: Верхние и нижние индексы
- •Лабораторная работа №4: Дескрипторы pre и var
- •Лабораторная работа №5: Сокращения и обратный адрес.
- •Задание
- •Глава 8. Списки Лабораторная работа №1: Нумерованные списки
- •Задание
- •Лабораторная работа №2: Маркированные списки
- •Задание
- •Лабораторная работа №3: Параметры элемента списка
- •Лабораторная работа №4: Многоуровневые списки
- •Задание
- •Глава 9. Графика на Web-странице Лабораторная работа №1: Вставка графики в текст
- •Лабораторная работа №2: Размеры изображения и контекстная подсказка
- •Задание
- •Лабораторная работа №3: Обтекание графики текстом
- •Задание
- •Лабораторная работа №4: Выравнивание по вертикали
- •Задание
- •Лабораторная работа №4: Картина в рамке
- •Лабораторная работа №5: Отступы
- •Задание
- •Глава 10. Табличный дизайн Лабораторная работа №1: Пример табличного дизайна
- •Задание
- •Лабораторная работа №2: Внутренние отступы
- •Задание
- •Лабораторная работа №3: Слияние и группировка ячеек
- •Задание
- •Глава 11. Фреймы Лабораторная работа №1: Фреймовая структура
- •Лабораторная работа №2: Размеры фреймов
- •Задание
- •Лабораторная работа №3: Вложенные фреймы
- •Задание
- •Лабораторная работа №4: Обрамление и отступы
- •Задание
- •Лабораторная работа №5: Ссылки. Фрейм без фреймов
- •Задание
- •Глава 12. Формы Лабораторная работа №1: Основная схема формы
- •Лабораторная работа №2: Текстовые строки
- •Лабораторная работа №3: Кнопки
- •Лабораторная работа №4: Текстовые поля
- •Лабораторная работа №5: Списки вариантов
- •Лабораторная работа №6: Списки переключатели
- •Лабораторная работа №7: Раскрывающиеся списки
- •Задание
- •Глава 13. Структура html-документа Лабораторная работа №1: Основные параметры Web-страницы. Отступы от края окна
- •Задание
- •Лабораторная работа №2: Цвет фона и цвет текста
- •Задание
- •Глава 14. Внешние параметры Web-страницы Лабораторная работа №1: Название Web-страницы
- •Глава 15. Основные принципы каскадных таблиц стилей Лабораторная работа №1: Простейшее описание стиля.
- •Задание
- •Лабораторная работа №2: Подклассы дескрипторов
- •Задание
- •Лабораторная работа №3: Задание фона и цвета текста
- •Задание
- •Лабораторная работа №4: Отступы и рамки
- •Задание
- •Глава 16. Понятие событий Лабораторная работа №1: Виртуальные события
- •Лабораторная работа №2: События мыши
- •Лабораторная работа №3: События клавиатуры
- •Задание
- •Задание по пройденному материалу
- •Рекомендуемая литература.
Введение
HTML – язык гипертекстовой разметки, предназначен для разметки и оформления документов, публикуемых в WWW или, проще сказать, HTML – документов. Этот язык независим от платформы, т.е. может работать в любых операционных системах.
HTML - язык дескрипторов. Дескриптор – это некое ключевое слово или сокращение, которое служит признаком того или иного форматирования данной части документа. Дескриптор заключают между знаками «больше» и «меньше»: <ДЕСКРИПТОР>.
Многие дескрипторы принадлежат к контейнерному типу: в них, как в контейнер, заключается фрагмент текста, форматирование которого определяется этим дескриптором, - например, выделение курсивом и т.д. Такие дескрипторы всегда парные: каждому открывающему дескриптору <Дескриптор> соответствует закрывающий, причём закрывающий дескриптор начинается с косой черты </Дескриптор>.
Встречаются и неконтейнерные, одинарные дескрипторы. Они не содержат текста, который нужно так или иначе отформатировать, а определяют характеристики документа в целом или описывают объект, который нужно вставить в данной точке документа, например картинку. Такие дескрипторы не имеют закрывающих «двойников».
Контейнерные дескрипторы, как правило, могут быть вложенными друг в друга:
Текст 1 <дескриптор 1> текст 2 <дескриптор 2> текст 3 </дескриптор 2> текст 4 </дескриптор 1> текст 5.
Главное правило при использовании вложенных дескрипторов – соблюдать последовательность: первым закрывается дескриптор, открытый последним.
Вся работа ведётся в программе Блокнот. Файл сохраняется с расширением .html. А результат просматривается в браузере Internet Explorer.
Глава 1. Основные принципы HTML
Лабораторная работа №1: Курсив
Текст, помещённый между дескрипторами <i> и </i>, отображается в броузере курсивом:
Лабораторная работа №2: Жирный шрифт и подчёркивание
Жирному шрифту соответствует дескриптор <b>, а подчёркиванию <u>:
В этом примере также был применён курсив.
Задание
Запишите строку текста с применением этих дескрипторов.
Глава 2. Абзацы
Лабораторная работа №1: Переход на новую строку
А бзацы в HTML размечаются с помощью дескриптора <p>.
Для того, чтобы вставить в текст «пустую» строку, используйте символ неразрывного пробела .
Лабораторная работа №2: Абзац с параметрами
У дескриптора <p> всего один параметр – align. Он принимает одно из четырёх значений – left, right, center, justify. Этот параметр «отвечает» за выравнивание текста – соответственно по левому или правому краю, по центру, или по ширине.
По умолчанию обычно текст выравнивается по левому краю, что соответствует коду
<p align=left>.
Сделаем выравнивание одного абзаца, например, по правому краю: