<IMG>

Материал из Викиреальностя
Перейти к: навигация, поиск

<IMG> — html-тег, предназначенный для отображения картинок. Имеет один обязательный параметр и несколько необязательных.

Данный тег не работает в викиразметке.

Содержание

[править] Примеры использования 

<img src=wiki.png>
<img src="images/files/wiki.png">
<img src="wiki.png" width=100 height=100 border=1>

Не требует закрывающего тега.

[править] Параметры

  • src — указывает адрес графического файла в виде URL. Допустимо указание файлов в форматах изображений, распознаваемых браузерами (*.GIF, *.JPG, *.PNG).
  • alt — текстовок описание картинки. Показывается браузером, если он не может или не успел загрузить картинку. В XHTML этот атрибут обязателен.
  • width — ширина картинки. Если значение параметра оканчивается на знак процента, то ширина принимает указанный процент, в ином случае принимает указанное число пикселей. Если атрибут вообще не указан, изображение выводится в своём исходном оригинальном размере.
  • height — высота картинки, параметр аналогичен параметру width

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

  • border — толщина рамки вокруг картинки в пикселях. Может быть указана целым числом или нулём.
  • VSPACE — вертикальные отступы сверху и снизу картинки в пикселях.
  • HSPACE — горизонтальные отступы слева и справа картинки в пикселях.
  • ALIGN — выравнивание изображения на странице. В зависимости от значений этого параметра изображение встраивается в текстовую строку (inline) либо тег становится блочным и добавляется обтекание картинок текстом.
    • top, bottom, middle — выравнивание картинки по вертикали внутри строки. Дополнительно существуют нестандартные значения: absbottom, absmiddle, texttop.
    • left, right — выравнивание картинки слева или справа на странице в виде блока, обтекаемого текстом.

[править] Карты изображений

[править] Внешняя карта изображений

  • ISMAP — добавление данного атрибута указывает, что к картинке может применяться внешняя карта изображения. Данный параметр указывается без значений.[1]

Тег <IMG> с атрибутом ISMAP работает, если находится внутри тега <A>, превращающего изображение в гиперссылку: 

<a href="http://example.com"><img src="img.gif" ismap></a>

При при нажатии на такую ссылку-изображение происходит переход на указанный адрес с передачей в составе URL дополнительных параметров в виде двух разделённых запятой чисел, являющихся координатами курсора мыши на картинке в момент нажатия. Параметры передаются методом GET и отделяются от остального адреса знаком вопроса:

http://example.com?W,H

где W это ширина, а H — высота в пикселях относительно верхнего левого угла изображения. Координаты передаются на сервер и считываются обработчиком, который указывается в атрибуте HREF тега <A>.[2]

[править] Локальная карта изображений

  • USEMAP — атрибут, добавляющий локальную карту изображения. Позволяет размечать картинку на активные области, которым сопоставляются гиперссылки. Локальные карты обрабатываются не на стороне веб-сервера, а на компьютере пользователя. В качестве значения атрибута USEMAP указывается имя локальной карты через знак решётки «#», связывающее изображение с картой:[3] 
<IMG SRC="img.gif" USEMAP="#name">

Сама локальная карта описывается тегом-контейнером <MAP> с атрибутом NAME, через который присваивается его имя. Внутри этого тега располагаются непарные теги <AREA>, каждый из которых описывает координаты отдельной области изображения и активную ссылку для этой области. Атрибуты тега <AREA>:

  • SHAPE — форма области изображения:
circle — круг;
rect — прямоугольник;
poly — многоугольник;
default — оставшаяся область;
  • COORDS — координаты в виде чисел в пикселях, перечисляемых через запятую. Формат координат зависит от выбранной формы области.
  • HREF — URL ссылки для выделенной области изображения. Если ссылки нет, добавляется атрибут NOHREF без значений.

Карта размещается на той же странице, что и картинка.[2]

[править] История

[править] История появления

Тег появился при разработке первого браузера Mosaic, создатели которого были озабочены, чтобы браузер открывал картинки прямо в тексте документа, а не в новом окне при клику по ссылке. В феврале 1993 года руководивший разработкой Майк Андриссен в списке рассылки www-talk, популярном среди разработчиков Интернета, в новой теме предложил новый элемент HTML:

I’d like to propose a new, optional HTML tag:

IMG

Required argument is SRC=”url”.

Несмотря на сомнения скептиков и противодействие таких мэтров, как сам создатель Интернета Тим Бернерс-Ли, тег был включен в очередной релиз браузера, а со временем, его добавили в спецификацию HTML 2.0, вышедшую у W3C в 1995 году.[4]

[править] Исторические атрибуты и параметры

Параметры SRC, ALT, HEIGHT, WIDTH и ALIGN существовали уже в первых версиях HTML. Параметры BORDER, VSPACE и HSPACE были введены в HTML 2.0 (VSPACE и HSPACE были добавлены как расширения HTML в браузере Netscape). Также в HTML 2.0 были введены внешние карты изображений на основе атрибута ISMAP.[2]

В Netscape Navigator 1.0 также был введён атрибут LOWSRC. Предназначался он для указания альтернативного файла изображения в низком разрешении при медленной загрузке веб-страницы (<IMG SRC="URL" LOWSRC="URL">). Ныне этот атрибут устарел и не используется в современных браузерах.

В HTML версии 3.2 для тега <IMG> использовался атрибут ALIGN, предназначавшийся для выравнивания изображения на странице. Допустимые его значения: TOP, BOTTOM, MIDDLE, LEFT, RIGHT. В браузере Netscape Navigator начиная с версии 1.0 существовали дополнительные варианты значений этого атрибута: TEXTTOP, ABSMIDDLE, BASELINE, ABSBOTTOM.[3] Значения ABSMIDDLE, BASELINE, ABSBOTTOM были стандартизированы в HTML версии 2.0.[1]

[править] Примечания

  1. ↑ 1,0 1,1 HTML — Документация // Городской Кот. — Softservice Group, 1996.
  2. ↑ 2,0 2,1 2,2 Д. Рассохин, А. Лебедев World Wide Web - всемирная информационная паутина в сети Internet. Карты (Maps, Clickable Images, Imagemaps).. — Химический факультет МГУ www.chem.msu.su, 15 Июль, 1997. — В. Второе издание.
  3. ↑ 3,0 3,1 Kevin Werbach Краткое руководство по HTML перевод на русский Станислава Малышева, 1996 год, c_rabbit.chat.ru
  4. ↑ https://geektimes.ru/post/290419/
Img относится к теме «HTML»   ±
Источник — «http://wikireality.ru/w/index.php?title=Img&oldid=655631»