Вставка графических изображений

В документах HTML кроме текста могут присутствовать графические изображения, для вставки которых используется тег <IMG> Допускается использование файлов в формате GIF или JPG/JPEG, поскольку большинство броузеров имеют встроенные модули декодирования для воспроизведения данных форматов, а для систем, работающих под управлением операционных систем семейства Windows, допускается использование файлов формата BMP. Следующий пример демонстрирует вставку в документ JPG файла):

Здесь атрибут src=" " определяет URL-адрес графического файла В приведенном примере файл будет размещен в области шириной 542 и высотой 407 пикселей соответственно. Если размеры, указанные атрибутами height=" " (высота) и width=" " (ширина), не совпадают с размерами графического файла, то последний масштабируется. Масштабирование может привести к резкому ухудшению качества графического файла, поэтому рекомендуется задавать размеры, соответствующие размерам графического файла, или не указывать их вообще. Но для больших графических файлов рекомендуется всегда задавать их размеры для ускорения работы броузера. Если размеры не заданы, то, встретив рисунок, броузер прекращает вывод текста и ждет загрузки всего рисунка для того, чтобы определить его размеры, а это задерживает загрузку страницы.

Пример вставки рисунка:

<HTML> 
 <HEAD>
  <ТIТLЕ>Вставка pисунка</TITLE> 
 </HEAD> 
 <BODY>

  <IMG src=foto.jpg width="542" height="407"
       alt="девушка твоей мечты">

 </BODY> 
</HTML>

Атрибут alt="..." указывает броузеру на то, какой именно текст следует подставить на место рисунка, если пользователь отключил загрузку графических файлов или из-за разрыва соединения файл не был загружен.

Картинку можно так же использовать для указания на гиперссылку. Например:
<A HREF="index.html"><IMG SRC="snail.gif" border="0" alt="На главную страничку" height="84" width="92"></A>

По умолчанию броузер рисует рамку вокруг рисунка, которая отмечена как гиперссылка. Для того чтобы убрать рамку используют атрибут border="..." в теге <IMG> с нулевым значением.

Кроме того имеется возожность создания рисунка с гиперссылками, в ктором разные части изображения имееют ссылки на разные документы. Такое средство называют активными картами или карты-изображения.

Шаг 4 - Вставка графических изображений