- •Южно-Уральский государственный университет
- •И дизайн сайтов
- •Лабораторная работа № 1 Создание Web-страниц. Работа с текстом
- •1.1. Введение в язык html
- •Минимальный html-код
- •1.2. Основные теги языка html
- •1.2.2. Заголовок внутри документа
- •1.2.3. Теги для форматирования отдельных символов или групп символов
- •1.2.4. Физические теги форматирования
- •1.2.5. Размер, гарнитура и цвет шрифта
- •1.2.6. Теги абзаца и перевода строки
- •1.2.7. Выравнивание текста
- •1.2.8. Комментарии
- •1.2.9. Форматирование с использованием каскадных таблиц стилей (css)
- •1.2.9.1. Назначение стилей отдельным элементам страницы
- •1.2.9.2. Назначение стилей нескольким элементам одной страницы – создание внедренной таблицы стилей
- •1.2.9.3. В следующем примере в качестве селекторов используются непосредственно теги html
- •1.2.9.4. Селектор class
- •1.2.9.5. Идентификаторы селекторов
- •1.2.9.6. Контекстные селекторы
- •1.2.9.7. Назначение стилей для нескольких страниц сайта
- •1.2.9.8. Импортирование таблиц каскадных стилей
- •1.2.10.2. Свойства тега, определенные в .Block1 и .Block2 и другие часто применяемые свойства блоковых структур:
- •1.3. Задание к лабораторной работе №1
- •2.1.2. Теги абзаца и перевода строки для графики
- •2.1.3. Дополнительные элементы оформления
- •2.1.3.1. Разделительные полосы
- •2.1.3.3. Фоновый звук
- •2.1.4. Добавление внедренных объектов мультимедиа
- •2.1.5. Добавление элементов управления ActiveX
- •2.2. Задание к лабораторной работе №2
- •Лабораторная работа №3 Организация гипертекстовых связей
- •3.1. Методические рекомендации
- •3.1.1. Ссылки на фрагмент документа
- •3.1.2. Графические ссылки
- •3.1.3. Цвета гиперссылок
- •3.1.4.1. Настройка эффектов перехода Web-страницы
- •3.2. Задание к лабораторной работе №3
- •4.1.2. Текст заранее заданного формата (преформатированный текст)
- •Смещение текста
- •4.1.4. Воспроизведение видео в Internet Explorer
- •4.1.5. Бегущая строка
- •4.1.6. Организация возвратов
- •4.1.7. Списки определений (словарные списки)
- •4.2. Задание к лабораторной работе №4
- •Определение структуры и цветовое оформление таблиц
- •5.1.2. Выравнивание в таблицах
- •5.1.3. Составные ячейки
- •6.1.2. Плавающие фреймы
- •6.1.2. Изображения-карты
- •6.1.3. Интерактивные элементы – Roll Over (обработчик событий MouseOver)
- •6.2. Задание к лабораторной работе №6
- •7.1.2. Элементы управления формы
- •7.1.2.1 Поля ввода
- •7.1.2.2. Текстовые области
- •7.1.2.3. Переключатели
- •7.1.2.4. Флажки
- •7.1.2.5. Раскрывающиеся списки
- •7.1.3. Встроенные фильтры ie
- •Фильтр glow()
- •Расширенный язык разметки гипертекста
- •Библиографический список
- •Оглавление
Оглавление
Южно-Уральский государственный университет 1
ЛАБОРАТОРНАЯ РАБОТА № 1 3
Создание Web-страниц. Работа с текстом 3
1.1. Введение в язык HTML 3
1.2. Основные теги языка HTML 3
1.2.2. Заголовок внутри документа 4
1.2.3. Теги для форматирования отдельных символов или групп символов 4
1.2.4. Физические теги форматирования 4
1.2.5. Размер, гарнитура и цвет шрифта 5
1.2.6. Теги абзаца и перевода строки 5
1.2.7. Выравнивание текста 6
1.2.8. Комментарии 6
1.2.9. Форматирование с использованием каскадных таблиц стилей (CSS) 6
1.2.9.1. Назначение стилей отдельным элементам страницы 7
1.2.9.2. Назначение стилей нескольким элементам одной страницы – создание внедренной таблицы стилей 8
1.2.9.3. В следующем примере в качестве селекторов используются непосредственно теги HTML 9
1.2.9.4. Селектор class 10
1.2.9.5. Идентификаторы селекторов 11
1.2.9.6. Контекстные селекторы 13
1.2.9.7. Назначение стилей для нескольких страниц сайта 15
1.2.9.8. Импортирование таблиц каскадных стилей 16
1.2.10. Тег DIV 17
1.2.10.1. Пример использования тега <DIV> 18
1.2.11. Тег SPAN 20
1.3. Задание к лабораторной работе №1 22
ЛАБОРАТОРНАЯ РАБОТА №2 22
Вставка графических изображений 22
2.1. Методические рекомендации 22
2.1.1. Вставка графики 22
2.1.2. Теги абзаца и перевода строки для графики 23
2.1.3. Дополнительные элементы оформления 24
2.1.3.1. Разделительные полосы 24
2.1.3.2. Установочные атрибуты тега <BODY> 24
2.1.3.3. Фоновый звук 24
2.1.5. Добавление элементов управления ActiveX 26
2.2. Задание к лабораторной работе №2 27
ЛАБОРАТОРНАЯ РАБОТА №3 27
Организация гипертекстовых связей 27
3.1. Методические рекомендации 27
3.1.1. Ссылки на фрагмент документа 28
3.1.2. Графические ссылки 28
3.1.3. Цвета гиперссылок 29
3.1.4.1. Настройка эффектов перехода Web-страницы 32
3.2. Задание к лабораторной работе №3 33
ЛАБОРАТОРНАЯ РАБОТА №4 33
Элементы оформления HTML-страниц 33
4.1. Методические рекомендации 33
4.1.1. Списки 33
4.1.2. Текст заранее заданного формата (преформатированный текст) 35
4.1.3. Выделение цитат. Тег <BLOCKQUOTE> 35
4.1.4. Воспроизведение видео в Internet Explorer 36
4.1.5. Бегущая строка 36
4.1.6. Организация возвратов 37
4.1.7. Списки определений (словарные списки) 37
4.2. Задание к лабораторной работе №4 38
ЛАБОРАТОРНАЯ РАБОТА №5 38
Разработка таблиц 38
5.1. Методические рекомендации 38
5.1.1. Основные положения 38
5.1.2. Выравнивание в таблицах 40
5.1.3. Составные ячейки 41
5.2. Задание к лабораторной работе №5 42
ЛАБОРАТОРНАЯ РАБОТА №6 42
Фреймы, изображения-карты, ролловеры 42
6.1. Методические рекомендации 42
6.1.1. Фреймы 42
6.1.2. Плавающие фреймы 44
6.1.2. Изображения-карты 46
6.1.3. Интерактивные элементы – Roll Over (обработчик событий MouseOver) 47
6.2. Задание к лабораторной работе №6 48
ЛАБОРАТОРНАЯ РАБОТА №7 48
Элементы программирования форм, фильтры IE 48
7.1. Методические рекомендации 48
7.1.1. Программирование форм 48
7.1.2. Элементы управления формы 49
7.1.2.1 Поля ввода 49
7.1.2.2. Текстовые области 50
7.1.2.3. Переключатели 52
7.1.2.4. Флажки 53
7.1.2.5. Раскрывающиеся списки 54
7.1.3. Встроенные фильтры IE 55
Фильтр glow() 57
7.1.4. XHTML (Extensible Hyper Text Markup Language) – 58
расширенный язык разметки гипертекста 58
Библиографический список 59
ОГЛАВЛЕНИЕ 59