IMG - встроенные изображения
<!ENTITY % IAlign "(top|middle|bottom|left|right)"> <!ELEMENT IMG - O EMPTY -- Embedded image --> <!ATTLIST IMG src %URL #REQUIRED -- URL of image to embed -- alt CDATA #IMPLIED -- for display in place of image -- align %IAlign #IMPLIED -- vertical or horizontal alignment -- height %Pixels #IMPLIED -- suggested height in pixels -- width %Pixels #IMPLIED -- suggested width in pixels -- border %Pixels #IMPLIED -- suggested link border width -- hspace %Pixels #IMPLIED -- suggested horizontal gutter -- vspace %Pixels #IMPLIED -- suggested vertical gutter -- usemap %URL #IMPLIED -- use client-side image map -- ismap (ismap) #IMPLIED -- use server image map -- >
Данный элемент используется в документе HTML для вставки различных изображений.
Элемент IMG не является контейнером, так что использовать здесь
закрывающий тэг не разрешается. Изображение может смещаться по вертикали относительно
текущей строки текста, либо ставиться с левого или правого края. См. описание атрибута
CLEAR в элементе BR, диктующего как тексту следует
"обтекать" подобные изображения.
например, <IMG SRC="canyon.gif" ALT="Большой Каньон">
Элементы IMG могут иметь следующие атрибуты:
src
Данный атрибут необходимо указывать для каждого элемента IMG.
Определяет URL-адрес того источника, откуда берется изображение, например это может
быть графический файл типа GIF, JPEG или PNG.
alt
Используется в качестве текстового описания к данному изображению и совершенно
необходим для взаимодействия с браузерами, ориентированными на речевой интерфейс либо
работающими исключительно в текстовом режиме.
align
Определяет, как будет позиционироваться данное изображение относительно строки
текста, в которую оно помещено:
align=top
Ставит на один уровень верхний край изображения и верхнюю границу текущей строки.
Разработчики браузеров расходятся в том, как интерпретировать этот атрибут. Некоторые
из браузеров принимают во внимание лишь строку текста, стоящую перед элементом IMG, и
игнорируют все, что стоит за ним.
align=middle
Ставит базовую линию текущей строки вровень с центром изображения.
align=bottom
Используется по умолчанию и выравнивает нижнюю часть изображения по базовой линии
текущей строки.
align=left
Ставит изображение с левого краю. При этом левый маркер разметки временно
смещается так, чтобы текст, следующий за изображением, "обтекал" его по правому краю.
Описанный здесь алгоритм компоновки изменяется в присутствии любого текста,
выровненного по левому краю, либо любой другой картинки, оказавшейся при разметке
прямо перед нашим изображением. При наличии такого текста (но не картинки)
изображения, подлежащие выравниванию по левому краю, как правило, переносятся на новую
строку, а текст, следующий за всем этим, печатается опять на прежнем уровне.
Смещает картинку к правому краю страницы. Затем правый маркер разметки временно
передвигается так, чтобы текст, выводимый на экран вслед за картинкой, обтекал ее по
левому краю. На предложенную здесь схему разметки влияет наличие любого выровненного
по правому краю текста или другой картинки, оказавшейся при разметке перед нашим
изображением. При наличии такого текста (но не картинки) изображение, подлежащее
выравниванию по правому краю, как правило, смещается вниз на новую строку, а следующий
за этим изображением текст продолжает печататься на прежнем уровне.
Заметим, что некоторые браузеры начинают ставить фиктивные пробелы, если на
странице рядом встречаются несколько изображений, подлежащий выравниванию по левому
краю (либо, наоборот, по правому). Как следствие, авторы документов не должны
полагаться на то, что браузеры различных производителей будут вести себя одинаковым
образом. См. в описании элемента как различными
способами управлять текстовым потоком.
width
Задает в пикселах ширину изображения. Если этот атрибут указан одновременно с
атрибутом height, то это дает возможность браузеру для очередного изображения заранее
зарезервировать место на экране, еще до того, как сама картинка будет доставлена ему
1по сети.
height
Задает в пикселах высоту изображения. Если этот атрибут указан одновременно с
атрибутом width, то это позволяет браузеру заранее резервировать место на экране для
очередного изображения, еще до того, как последнее будет доставлено по сети.
border
Если элемент IMG участвует в разметке как составная часть некой
гипертекстовой связи, то браузеры, как правило, будут отмечать это обстоятельство,
рисуя цветную рамку вокруг подобной картинки (обычно синего цвета). Атрибутом
border можно воспользоваться, желая выбрать определенную ширину для
подобной рамки (в пикселах). Если же необходимо полностью избавиться от рамки, укажите
border=0. Браузеры конечных пользователей должны иметь дополнительные
средства, напоминающие им, что над данным изображением можно щелкать клавишей мыши.
Например, это может быть изменение формы указателя мыши при попадании на подобное
изображение.
hspace
Данный атрибут может использоваться для того, чтобы слева и справа от изображения
оставлять чистые поля. Ширину этих полей (в пикселах) как раз и задает атрибут
HSPACE. По умолчанию считается, что атрибут HSPACE имеет
малое, но все же ненулевое значение.
vspace
Данный атрибут может использоваться для того, чтобы над и под текущим изображением
создавать чистые поля. Занчение атрибута VSPACE указывает ширину этих
полей (в пикселах). По умолчанию считается, что атрибут VSPACE имеет
малое, но все же ненулевое значение.
usemap
Может использоваться для того, чтобы сообщить браузеру URL-идентификатор фрагмента
навигационной карты, создаваемой элементом на компьютере
клиента.
ismap
Если элемент IMG является составной частью гипертекстовой связи и
пользователь щелкает клавишей мыши над соответствующим изображением, то атрибут
ISMAP заставляет браузер передавать на сервер координаты точки, где был
произведен щелчок. Реализация данного механизма встречается с проблемами в случае
браузеров с чисто текстовым и речевым интерфейсом. Там, где это возможно, вместо ISMAP
используйте элемент MAP.
В следующем примере показано, как пользоваться атрибутом ISMAP:
<a href="/cgibin/navbar.map"><img src=navbar.gif ismap
border=0></a>
Передача серверу координат точки, где произведен щелчок, осуществляется следующим
образом. Браузер конечного пользователя сам конструирует новый адрес URL, отталкиваясь
от старого URL, заданного в атрибуте HREF. Делает он это, добавляя в
конце символ "? ", координату X, запятую ", " и координату Y соответствующей точки
(единицей измерения служит пиксел). Затем осуществляется переход на созданый таким
образом адрес URL. Например, если пользователь щелкнул клавишей мыши по точке с
координатами x=10 и y=27, то будет создан следующий URL:
"/cgibin/navbar.map?10,27". Обычно удачным оказывается подход,
когда окружающая изображение цветная рамка удаляется, а вместо этого используются
другие чисто графические элементы, показывающие, что по данному изображению можно
щелкать клавишей мыши.
Заметим, что что когда мы говорим о пикселах, мы имеем ввиду пикселы на экране
монитора, и указываемые при разметке значения должны умножаться на соответствующий
коэффициент при воспроизведении соответствующих изображений на устройствах с очень
высоким разрешением, например при распечатке на лазерных принтерах. Например, если
браузер пользователя имеет на дисплее монитора разрешение 75 пикселов на дюйм, то при
передаче этой информации на лазерный принтер с разрешением 600 точек на дюйм,
величины, указанные при разметке HTML-страниц в пикселах, должны умножаться на
коэффициент 8.