Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
shpory_po_informatike.doc
Скачиваний:
328
Добавлен:
18.02.2016
Размер:
1.01 Mб
Скачать

85. Графика

Как правило, браузеры поддерживают рисунки в форматах GIF и JPG.

Формат GIF обычно используется для хранения рисунков с четкими деталями, небольшим набором цветов (до 256) и возможностью анимации ("мультипликация" на Web-страницах, графические кнопки, "украшения"). Кроме того, формат GIF поддерживает эффект прозрачности, то есть, точки определенного цвета можно сделать того же цвета, что и фон страницы. Второй полезный эффект - возможность черезстрочной загрузки изображения GIF - то есть, изображение может постепенно "проявляться" по мере загрузки страницы, что даст пользователю возможность уже на ранней стадии загрузки получить представление о содержании картинки.

Формат JPG используется для хранения полноцветной графики и фотоизображений. Этот формат поддерживает 24-битовую графику, то есть, 16.7 миллиона цветов. Благодаря компрессии изображений, столь многоцветные файлы JPG имеют приемлемые размеры, но сжатие производится за счет некоторой потери качества. Поэтому при подготовке иллюстраций для Web-страницы всю предварительную обработку следует производить с несжатыми изображениями, например, в формате BMP, а в GIF или JPG конвертировать только окончательный вариант картинки.

Из доступных приложений эффективно управлять файлами в форматах GIF и JPG позволяет Microsoft Photo Editor, входящий в пакет программ Microsoft Office. Профессионалы используют гораздо более мощные графические пакеты, такие как Adobe PhotoShop и Corel Draw.

Рисунок в любом формате вставляется в документ HTML тагом следующего вида:

<IMG SRC="URL рисунка" WIDTH="ширина" HEIGHT="высота" BORDER="рамка" ALIGN="выравнивание" HSPACE="отступ по горизонтали" VSPACE="отступ по вертикали" ALT="текст">

Закрывать этот таг не нужно.

Опция SRC содержит абсолютный или относительный адрес рисунка, если рисунок не найден, на его месте выведется пустая рамка. При разработке сайта используются, как правило относительные адреса. Хотя SRC - единственная обязательная опция тага, указание всех остальных опций настоятельно рекомендуется.

Опции WIDTH и HEIGHT определяют ширину и высоту рисунка в пикселах (точках). Если ширина и высота не указаны, загрузка страницы замедляется и часто приводит к некрасивому эффекту "скачущего" текста на экране. Если указанные ширина и высота не соответствуют действительным размерам рисунка, при выводе он будет отмасштабирован, что также существенно замедляет загрузку (единственное допустимое исключение - уменьшение или увеличение при загрузке в 2 раза).

Значение опции BORDER также указывается в пикселах и определяет ширину рамки вокруг рисунка, являющегося гиперссылкой. Если рамка не нужна, значением этой опции следует сделать 0, а если рисунок не является ссылкой, опцию можно не указывать.

Опция ALIGN определяет размещение рисунка относительно текста, единственные понимаемые всеми браузерами значения - LEFT (слева) и RIGHT (справа). Опции HSPACE и VSPACE, указываемые в пикселах, определяют размер свободного места вокруг рисунка по горизонтали и вертикали. Рисунок не выглядит сливающимся с текстом при их значениях в пределах 5-15.

Текст, переданный в опции ALT, выводится вместо рисунка, если в браузере отключен вывод рисунков или они не успели загрузиться, а также показывается в качестве подсказки при наведении "мышки" на рисунок. Обычно этот текст содержит название рисунка.

Примеры: <img src="http://www.ngasu.nsk.su/prikl/head.gif" width="267" height="106" align="left" alt="Заставка">

А эта картинка со ссылкой подготовлена с помощью тага <IMG SRC="http://www.ngasu.nsk.su/prikl/ngasu.gif" WIDTH="148" HEIGHT="111" BORDER="1" HSPACE="10" VSPACE="10" ALIGN="LEFT" ALT="Страница кафедры">

HTML позволяет легко добавить на страницу фоновое изображение. Для этого достаточно указать опцию background="URL рисунка" в таг BODY. Рисунок может быть в формате GIF или JPG. Точно так же можно добавить фоновое изображение в таблицу, строку или ячейку таблицы - для этого достаточно указать опцию background="URL рисунка" в таге <table>, <tr> или <td>.

Соседние файлы в предмете [НЕСОРТИРОВАННОЕ]