Элемент <img>

27 Сен, 2008

Автор: Bormaley В: Графика

Когда вы вставляете картинку в свою веб-страницу, вы делаете это, указывая ее URL, то есть уникальный адрес, по которому размещен файл с изображением. Он может указывать на тот же каталог сервера, в котором находятся остальные файлы вашего сайта, а может содержать адрес какого-то другого сервера в Интернете.

Стандартным способом добавления изображений является использование элемента <img />. При этом картинка вставляется непосредственно в то место, где написан этот тег (такое изображение называется внутристрочным). Другой способ — «плавающие изображения» — рассматривается далее в данной главе. Основной разницей между этими способами является то, что обычное изображение не привязывается к полям страницы, а привязывается к тексту. Плавающее изображение может быть привязано к левому или правому полю.

Итак, поговорим об элементе <img />. С его помощью резервируется место на странице под изображение. Базовая конструкция должна выглядеть таким образом: <img src="image_URL" />.
Атрибут src расшифровывается как source (источник) и содержит адрес графического файла То есть вместо слов imageJJRL должен быть реальный URL.

Адрес файла может представлять собой как полный путь (например, Ваш сайт/images/productljpg), так и относительный (если, например, файл расположен на том же сервере, что и HTML-страница).

Относительный URL означает, что не указывается первая часть адреса (например, /images/productljpg). При этом считается, что первая часть совпадает с URL той страницы, на которой расположена ссылка на изображение.

Вот пример размещения ссылки на графический файл на веб-странице (рис. 6.7).

<p><img src="threegif">

Продукция ресторана Rudolfo - это вкусная, полезная пища,

которая не отягощает ваш желудок и бумажник.

Прекрасные блюда европейской кухни, включая вина,

произведенные в самом сердце старой доброй Европы.

Обстановка ресторана располагает к спокойному

разговору наедине за чашечкой кофе .

Три звездочки.</р>

Вы, вероятно, заметили, что в атрибуте src указан относительный UR.L Однако с тем же успехом на его месте мог быть и полный адрес:

<img src="Ваш сайт/images/three.gif" />

Рис. 6.7 Обратите внимание: изображение появилось на той же строке, что и текст Это внутристрочное изображение

Оба варианта вполне приемлемы, но полный адрес имеет смысл указывать только тогда, когда он содержит ссылку на изображение, расположенное где-то в другом месте в Интернете. Если файл находится в подкаталогах (относительно HTML-файла), подойдет такой вариант:

<img src="/images/images.gif" />

ПРИМЕЧАНИЕ

Следует помнить, что нельзя помещать на веб-странице ссылки на файлы, расположенные на вашем локальном жестком диске (если вы, конечно, хотите, чтобы пользователи вебсайта увидели их содержимое). В Сети нет вашего жесткого диска, есть только жесткий диск веб-сервера. Поэтому если вы создадите ссылку вида <img src="file:///c|web_site/image.gif" />, то пользователи не смогут увидеть указанное изображение.