- •Южно-Уральский государственный университет
- •И дизайн сайтов
- •Лабораторная работа № 1 Создание Web-страниц. Работа с текстом
- •1.1. Введение в язык html
- •Минимальный html-код
- •1.2. Основные теги языка html
- •1.2.5. Размер, гарнитура и цвет шрифта
- •1.2.6. Теги абзаца и перевода строки
- •1.2.2. Заголовок внутри документа
- •1.2.3. Теги для форматирования отдельных символов или групп символов
- •1.2.4. Физические теги форматирования
- •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()
- •Расширенный язык разметки гипертекста
- •Библиографический список
- •Оглавление
Фильтр glow()
Фильтр glow() добавляет сияние за пределами границ изображения. Подобно фильтрам dropShadow() и shadow(), фильтр glow() применяется к контейнерному элементу. Свойства и значения для фильтра glow() показаны в таблице
-
Таблица 1 Свойства и значения для фильтра glow()
Свойство
Значение
filter:glow()
color=color
strength=n
Свойство color=color задает цвет сияния, а свойство strength=n задает его размер в пикселях. Значение strength используется также в качестве размера поля, окружающего изображение, и размера поля, окружающего текст.
Следующий код создает эффект сияния, показанный ниже на рисунке .
|
<div style="height:0px; filter:glow(color=slategray, strength=20)">
<h2 style="margin:20px">Сияющая картина</h2>
<img src="Ani-Sl.jpg" style="margin:20px"/>
</div>
7.1.4. XHTML (Extensible Hyper Text Markup Language) –
Расширенный язык разметки гипертекста
Язык XHTML предназначен для замены HTML и считается более строгой версией HTML. Разработчики определяют XHTML как последнюю версию языка разметки гипертекста, которая постепенно вытеснит HTML. Все современные браузеры интернета поддерживают XHTML.
Язык XHTML, сохраняя все особенности HTML, вносит более строгие правила создания страниц, чтобы приблизиться к «идеальному» коду. Это позволяет делать сайты независимыми от устройства отображения и браузера (обозревателя) интернета. То есть сайт, созданный на языке XHTML, должен корректно отображаться во всех современных обозревателях и платформах, включая персональные компьютеры, смартфоны и т.д.
Еще одним немаловажным аргументом в пользу практического использования XHTML является то, что многие современные HTML-редакторы, например Adobe Dreamweaver используют именно такую кодировку.
На практике, чтобы получился корректный XHTML код в HTML достаточно добавить четыре правила:
Все теги должны быть записаны в нижнем регистре, то есть нельзя писать <BODY>, а надо писать <body>.
Все теги должны быть закрыты. В случае, если элемент не имеет закрывающего тега (например, <IMG> или <BR>), надо добавлять слэш в конце тега <img /> и <br />. Пробел между именем тега и слэшем обязателен.
Вложенность тегов должна быть корректной. Например, нельзя писать <b><p>текст</b></p>, а надо писать <p><b>текст</b></p>.
Все атрибуты должны быть заключены в кавычки. Например, нельзя писать <P ALIGN=center>, а надо писать <p align="center">.
Библиографический список
1. Рева О.Н. HTML просто как дважды два: / О. Н. Рева – М., ООО “Издательство Эксмо”, 2007. – 240 с.: ил.
2. Ахметов К. Microsoft Internet Explorer 4.0 для всех: / К. Ахметов, А. Федоров – М.: Компьютер Пресс, 1997. – 336 с.: ил.
3. Дин Шарф. HTML 3.2. Справочник. / Шарф Дин – СПб.: Издательство ”Питер Паблишинг”, 1998. – 220 с.: ил.
