Основы работы с XHTML и CSS
Тег <img/>
Изображения GIF и JPEG размещают на странице Web с помощью линейного тега <img/>. Общий формат этого тега показан ниже.
<img src="url" alt="text"/>
Листинг 2.35. Общая форма тега <img> (html, txt)
Тег <img/> кодируется на странице Web в том месте, в котором должно выводиться изображение. Атрибут src задает источник или расположение файла изображения. Если файл изображения находится в том же каталоге, что и страница Web, на которой оно выводится, то в качестве URL в src достаточно указать только имя файла.
Атрибут alt является обязательным в XHTML 1.1. Его значение "text" задает краткое всплывающее описание изображения, когда указатель мыши перемещается поверх изображения. Эта текстовая строка выводится, когда пользователи отключают в браузере вывод графики, задавая тем самым текстовое описание отсутствующих изображений. Текст также может быть озвучен специальной программой чтения, применяемой пользователями с недостатками зрения, которые иначе не могут видеть или четко различать изображения.
Отметим, что тег <img/> является пустым тегом; он не использует пару из открывающего и закрывающего тегов, так как не охватывает никакой контент. Он только помечает расположение изображения на странице. Он, как линейный тег, должен кодироваться внутри блочного тега, такого, как тег <p>. По умолчанию изображение выравнивается по левому краю страницы.
Изображение JPEG, показанное на рисунке 2.15, должно находиться в том же каталоге, что и страница Web, на которой оно выводится. Изображение помещается на странице в месте расположения тега <img/> с соответствующим кодом. (Если провести указатель мыши над изображением на странице, то появится всплывающая подсказка атрибута alt).
<p><img src="Stonehenge.jpg" alt="Изображение Стоунхенджа"/></p>
Рис. 2.15. Код тега <img/> и вывод в браузере соответствующего изображения
Обратите внимание, что физическое расположение изображения может быть произвольным. На страницу помещается тег <img/>, содержащий адрес URL файла изображения. Когда страница Web загружается в браузер, этот URL используется для определения местоположения файла изображения, который затем передается браузеру отдельно для вывода на странице. Именно поэтому размер файла изображения является важным вопросом. Вывод изображения требует дополнительной передачи данных с сервера Web для каждого изображения, появляющегося на странице. Поэтому слишком большое количество изображений и их большие размеры увеличивают время загрузки страницы Web в окне браузера.
