Тег <img>
Тег <img> предназначен для отображения на веб-странице изображений в графическом формате GIF, JPEG или PNG. Адрес файла с картинкой задаётся через атрибут src. Если необходимо, то рисунок можно сделать ссылкой на другой файл, поместив тег <img> в контейнер <a>. При этом вокруг изображения отображается рамка, которую можно убрать, добавив атрибут border="0" в тег <img>.
Рисунки также могут применяться в качестве карт-изображений, когда картинка содержит активные области, выступающие в качестве ссылок. Такая карта по внешнему виду ничем не отличается от обычного изображения, но при этом оно может быть разбито на невидимые зоны разной формы, где каждая из областей служит ссылкой.
IExplorer | Chrome | Opera | Safari | Firefox | Android | iOS |
1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ | 1.0+ |
HTML: | 3.2 | 4.01 | 5.0 |
XHTML: | 1.0 | 1.1 |
HTML
<img src="URL" alt="альтернативный текст">
XHTML
<img src="URL" alt="альтернативный текст" />
alt - Атрибут alt устанавливает альтернативный текст для изображений.
border - Изображение, помещаемое на веб-страницу, можно поместить в рамку различной ширины.
height - Для изменения размеров изображения средствами HTML предусмотрены атрибуты height и width.
hspace - Для любого изображения можно задать невидимые отступы по горизонтали и вертикали с помощью атрибутов hspace и vspace.
ismap - Атрибут ismap говорит браузеру что рисунок является серверной картой-изображением.
longdesc - Атрибуты alt и title не могут содержать большой текст для описания изображения, поэтому атрибут longdesc позволяет указать адрес документа, где содержится аннотация к картинке.
lowsrc - Адрес изображения низкого качества, которое будет отображаться на веб-странице во время загрузки основного изображения.
src - Адрес графического файла, который будет отображаться на веб-странице.
usemap - Атрибут usemap связывает между собой картинку и карту-изображение, задаваемую с помощью контейнера <map>.
vspace - Для любого изображения можно задать невидимые отступы по горизонтали и вертикали с помощью атрибутов hspace и vspace.
width - Для изменения размеров изображения средствами HTML предусмотрены атрибуты height и width.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Тег IMG</title>
</head>
<body>
<p><a href="lorem.html"><img src="images/girl.png"
width="189" height="255" alt="lorem"></a>
Lorem ipsum dolor sit amet...</p>
</body>
</html>