Элемент <img>


3	12	1	4	1	1


3	1	6	1

Элемент <img> (от англ. image — изображение) предназначен для отображения на веб-странице изображений в графическом формате GIF, JPEG, SVG или PNG. Адрес файла с картинкой задаётся через атрибут src. Если необходимо, то рисунок можно сделать ссылкой на другой файл, поместив <img> в контейнер <a>.

Рисунки также могут применяться в качестве карт-изображений, когда картинка содержит активные области, выступающие в качестве ссылок. Такая карта по внешнему виду ничем не отличается от обычного изображения, но при этом оно может быть разбито на невидимые зоны разной формы, где каждая из областей служит ссылкой.

Синтаксис

<img src="<адрес>" alt="<текст>">

	Описание	Пример
<тип>	Указывает тип значения.	<размер>
A && B	Значения должны выводиться в указанном порядке.	<размер> && <цвет>
A \| B	Указывает, что надо выбрать только одно значение из предложенных (A или B).	normal \| small-caps
A \|\| B	Каждое значение может использоваться самостоятельно или совместно с другими в произвольном порядке.	width \|\| count
[ ]	Группирует значения.	[ crop \|\| cross ]
*	Повторять ноль или больше раз.	[,<время>]*
+	Повторять один или больше раз.	<число>+
?	Указанный тип, слово или группа не является обязательным.	inset?
{A, B}	Повторять не менее A, но не более B раз.	<радиус>{1,4}
#	Повторять один или больше раз через запятую.	<время>#

Атрибуты

alt: Альтернативный текст для изображения.
height: Высота изображения.
ismap: Говорит браузеру, что картинка является серверной картой-изображением.
loading: Используется для управления загрузкой изображений на веб-странице.
sizes: Задаёт размеры изображения для разных макетов страницы.
src: Путь к графическому файлу.
srcset: Путь к графическим файлам с учётом размера изображения и устройств.
width: Ширина изображения.
usemap: Ссылка на элемент <map>, содержащий координаты для клиентской карты-изображения.

Также для этого элемента доступны универсальные атрибуты и события.

Устаревшие атрибуты

align: Определяет, как рисунок будет выравниваться по краю и способ обтекания текстом.
border: Толщина рамки вокруг изображения.
hspace: Горизонтальный отступ от изображения до окружающего контента.
longdesc: Указывает адрес документа, где содержится аннотация к картинке.
vspace: Вертикальный отступ от изображения до окружающего контента.

Устаревшие атрибуты — это атрибуты элементов HTML, которые были частью предыдущих версий HTML, но больше не поддерживаются в последних версиях стандарта. Использование таких атрибутов не рекомендуется, поскольку они противоречат современной идеологии HTML и могут не поддерживаться последними версиями браузеров.

Добавлять к элементам HTML устаревшие атрибуты не надо, взамен применяются стили или другие элементы HTML.

Пример

<!DOCTYPE html> <html lang="ru"> <head> <meta charset="utf-8"> <title>IMG</title> </head> <body> <p><a href="page/lorem.html"><img src="image/girl.jpg" width="120" height="120" alt="Девочка с муфтой"></a></p> </body> </html>

Спецификация

Спецификация	Статус
HTML Living Standard	Живой стандарт
HTML 4.01 Specification	Заменённая рекомендация