Фоновые изображения

Рисунок 4 1 Webстраница сведений об авторе
Вы уже заметили — справа от поля ввода адреса находятся две кнопки. Одна из них имеет вид мишени и расположена левее; она нам сейчас бесполезна. Вторая гораздо интереснее: она имеет вид папки...
Фоновые изображения
Фоновые изображения Выше мы рассмотрели, как размещаются на Web-странице всевозможные изображения в разных форматах. Все эти изображения представляли собой полезное содержание страницы и нахо...
Рисунок 4 26 Webстраница с фоновым изображением
Рисунок 4.26. Web-страница с фоновым изображением Удачно подобранное фоновое изображение может заметно оживить Web-страницу. Но не следует выбирать в качестве фона слишком яркое или пестрое и...
Мультимедиа

Мультимедиа Мультимедиа (от англ, multimedia — многосредность) — это сокращенное обозначение информации, отличающейся от простых текста и графики. Мультимедиа — это звуки, музыка, видео, анима...
Поддержка мультимедийных данных
Поддержка мультимедийных данных Поговорим о том, каким же образом Web-обозреватель обрабатывает мультимедийное содержание. Некоторые типы мультимедийных данных поддерживаются Web-обозревателе...
Таблица 4 1 Типы MIME
Таблица 4.1. Типы MIME Тип файлов Тип MIME Архив RAR Архив ZIP...


Таблица стилей HTML
Таблица стилей HTML text/ess
Текстовый документ text/plain Допо...
Модули расширения
Модули расширения Если вы хотите поместить на Web-страницу какое-либо мультимедийное (и не только) содержание, обрабатываемое с помощью модуля расширения, вы, прежде всего, должны удостоверит...
Рисунок 4 27 Кнопка Plugin панели объектов
Рисунок 4.27. Кнопка Plugin панели объектов После этого в окне документа появится значок модуля расширения. Измените его размеры, как вы проделывали это с изображением. Результат показан на Р...
Рисунок 4 28 Модуль расширения
Рисунок 4.28. Модуль расширения Теперь обратим внимание на редактор свойств (Рисунок 4.29). Поля ввода W и Н, Н Space, V Space и Border и раскрывающийся список Align должны быть вам уже зна...
Рисунок 4 29 Редактор свойств

Рисунок 4.29. Редактор свойств при выделенном модуле расширения В поле ввода Src вводится имя файла данных. Справа от него расположена уже знакомая нам кнопка с изображением папки. Щелкнув по...
Рисунок 4 30 Диалоговое окно Parameters
Рисунок 4.30. Диалоговое окно Parameters Теперь посмотрим, как работает наш модуль расширения. Для этого закроем окно задания параметров, если оно открыто, выделим модуль расширения в окне до...
Рисунок 4 31 Запущенный модуль расширения
Рисунок 4.31. Запущенный модуль расширения Как видите, это привычный интерфейс проигрывателя мультимедийных файлов. Подавляющее большинство программ-проигрывателей имеют именно такой вид. Зде...
Внимание
Внимание Здесь мы описали интерфейс модуля расширения, предназначенного для проигрывания мультимедийных файлов. Интерфейс других модулей расширения, разумеется, будет иным. Закончив экс...
Рисунок 4 32 Видеоклип на Webстранице
Рисунок 4.32. Видеоклип на Web-странице В этом случае в контекстном меню доступны следующие пункты: Play — запуск проигрывания клипа; Rewind (Start of movie) — перемотка в начало;...

Элементы ActiveX
Элементы ActiveX Теперь рассмотрим элементы ActiveX и их размещение на Web-страницах. Для начала откроем новое окно Dreamweaver и сохраним новую пустую страницу в файле под именем 4.7.htm. П...
Рисунок 4 33 Кнопка ActiveX панели объектов
Рисунок 4.33. Кнопка ActiveX панели объектов Заметьте, что запроса на открытие файла данных Dreamweaver при этом не выдает. Как привязать данные к элементу ActiveX, мы сейчас рассмотрим. Взг...
Рисунок 4 34 Значок элемента ActiveX
Рисунок 4.34. Значок элемента ActiveX...
Рисунок 4 35 Редактор свойств
Рисунок 4.35. Редактор свойств при выделенном элементе ActiveX Найдите в редакторе свойств кнопку Parameters. Вы помните, зачем она нужна? Все дело в том, что у элемента ActiveX нет собствен...
Что дальше?
Что дальше? В этой главе мы рассмотрели помещение на Web-страницы различных нетекстовых элементов. Теперь наш Иван Иванович обзавелся лицом, правда, не бог весть каким. А страничка со сведени...

Работа с графическими изображениями
Работа с графическими изображениями Графические изображения (а также аудио- и видеоклипы), как вы помните, являются внедренными элементами, т. к. они не помещаются в сам HTML-код Web-страницы,...
Два вида графических изображений
Два вида графических изображений Все графические изображения делятся на две большие группы по принципу кодирования, хранения в файлах и отрисовки на устройствах вывода (экран, принтер и т. п.)...
Вставка графического изображения
Вставка графического изображения Ну вот, теория закончена. Пора переходить к практике. Прежде всего, запасемся портретом, который впоследствии поместим на нашу страницу. Только вот откуда ег...
Рисунок 4 2 Кнопка Image панели объектов
Рисунок 4.2. Кнопка Image панели объектов Нажмем эту кнопку. На экране появится диалоговое окно Select Image Source, показанное на Рисунок 4.3....
Рисунок 4 3 Диалоговое окно Select Image Source
Рисунок 4.3. Диалоговое окно Select Image Source Да-а-а... Взглянуть страшно. Но вас предупреждали, что автор не дружит с живописью! В общем, здесь описывать особо нечего. Раскрывающийся спи...

Рисунок 4 4 Страница сведений об авторе с его портретом
Рисунок 4.4. Страница сведений об авторе с его портретом Обратите внимание, что на правой и нижней границе портрета имеются небольшие черные квадратики. Это так называемые маркеры изменения р...
Рисунок 4 5 Страница сведений
Рисунок 4.5. Страница сведений об авторе после изменения размера портрета...
Рисунок 4 6 Вид редактора свойств при выделенном изображении
Рисунок 4.6. Вид редактора свойств при выделенном изображении Вы также можете изменить имя файла изображения, выбрав пункт Source File в контекстном меню или просто дважды щелкнув по изображе...
Рисунок 4 7 Маркер "плавающего" изображения
Рисунок 4.7. Маркер "плавающего" изображения Задать выравнивание изображения вы также можете в подменю Align контекстного меню. Итак, с редактором свойств мы разобрались. Теперь д...
Изображениягиперссылки
Изображения-гиперссылки В предыдущей главе мы научились преобразовывать фрагменты текста в гиперссылки. Но, кроме текста, гиперссылкой можно сделать и графическое изображение. Такие изображени...

Рисунок 4 8 Значок "коммерческое
Рисунок 4.8. Значок "коммерческое эт" — символ электронной почты Теперь преобразуем этот значок в почтовую гиперссылку. Для этого выделим его, наберем в поле ввода Link редактора св...
Активные изображения
Активные изображения Изображение-гиперссылка при наведении на нее курсора мыши никак не проявляет себя. Конечно, можно выставить параметр Border равным пяти или десяти, но это во многих случая...
Рисунок 4 9 Кнопка Rollover Image панели объектов
Рисунок 4.9. Кнопка Rollover Image панели объектов...
Рисунок 4 10 Диалоговое окно Insert Rollover Image
Рисунок 4.10. Диалоговое окно Insert Rollover Image В поле ввода Image Name вводится уникальное имя вставляемого активного изображения. Имя должно содержать только латинские буквы, цифры и зн...
Картыизображения
Карты-изображения Изображение-гиперссылка — это простейший случай графических гиперссылок, применяемых сейчас в Web-дизайне. Более сложным случаем являются активное изображение и карта-изображе...

Рисунок 4 11 Учебная Webстраница с картойизображением
Рисунок 4.11. Учебная Web-страница с картой-изображением Разместить на изображении "горячие области" нам помогут несколько элементов управления, находящиеся в левом нижнем углу реда...
Рисунок 4 12 Элементы управления
Рисунок 4.12. Элементы управления редактора свойств, использующиеся для создания "горячих областей" Прежде всего, рассмотрим четыре кнопки, расположенные вдоль нижней границы окна р...
Рисунок 4 13 Вид редактора свойств
Рисунок 4.13. Вид редактора свойств для выделенной "горячей области" Все элементы управления нового редактора свойств вам уже знакомы. Это поле ввода Src, используемое для ввода инт...
Рисунок 4 14 Готовая картаизображение
Рисунок 4.14. Готовая карта-изображение Пункт Link контекстного меню выводит на экран диалоговое окно Select File, где вы можете выбрать файл, на который будет ссылаться "горячая область...
Рисунок 4 15 Диалоговое окно Change Attribute
Рисунок 4.15. Диалоговое окно Change Attribute А о пунктах Bring To Front и Send To Back все того же неисчерпаемого контекстного меню поговорим подробнее. Иногда случается так, что две &quo...

Графика Macromedia Flash
Графика Macromedia Flash Выше мы уже упоминали мощнейший пакет векторной Web-графики и анимации Macromedia Flash, "родного брата" Dreamweaver. "Братство" это проявляется н...
Рисунок 4 16 Кнопка Flash Text панели объектов
Рисунок 4.16. Кнопка Flash Text панели объектов...
Рисунок 4 17 Диалоговое окно Insert Flash Text
Рисунок 4.17. Диалоговое окно Insert Flash Text В раскрывающемся списке Font выбирается шрифт, которым будет написан текст надписи. В поле ввода Size задается его размер в пунктах. Кнопки-вык...
Рисунок 4 18 Только что созданная надпись Flash
Рисунок 4.18. Только что созданная надпись Flash Редактор свойств позволяет отредактировать множество параметров надписи Flash (Рисунок 4.19). Как и у обычного изображения, доступно изменение...
Рисунок 4 19 Вид редактора свойств
Рисунок 4.19. Вид редактора свойств при выбранном изображении Flash Остальные элементы управления задают специфичные для изображений Flash параметры. Кнопка Edit (а также одноименный пункт ко...

Рисунок 4 20 Кнопка Flash Button панели объектов
Рисунок 4.20. Кнопка Flash Button панели объектов...
Рисунок 4 21 Диалоговое окно Insert Flash Button
Рисунок 4.21. Диалоговое окно Insert Flash Button Здесь вы видите, прежде всего, большой список Style, где представлены все доступные в Dreamweaver стили кнопок Flash. Мы не будем их все расс...
Рисунок 4 22 Только что созданная кнопка Flash
Рисунок 4.22. Только что созданная кнопка Flash Дизайнеры фирмы Macromedia приготовили для вас прекрасные шаблоны для создания Flash-кнопок. Не верите? Нажмите кнопку Play на редакторе свойст...
Рисунок 4 23 Кнопка Flash панели инструментов
Рисунок 4.23. Кнопка Flash панели инструментов Ну и, разумеется, вы можете поместить на Web-страницу любое изображение Flash, созданное вами или кем-то другим. Это выполняется очень просто. Н...
Графика Macromedia Shockwave
Графика Macromedia Shockwave Осталось сказать чуть-чуть о других форматах поддерживаемых данных. Macromedia Shockwave — непосредственный предшественник Flash. Чтобы поместить файл в этом фор...

Рисунок 4 24 Кнопка Shockwave панели объектов
Рисунок 4.24. Кнопка Shockwave панели объектов Внешний вид редактора свойств при выделенном изображении Shockwave показан на Рисунок 4.25. Как видите, свойства изображения Shockwave аналогичн...
Рисунок 4 25 Вид редактора свойств
Рисунок 4.25. Вид редактора свойств при выделенном изображении Shockwave...