Добавляет изображение на страницу по адресу, указанному в атрибуте src. Рекомендуется также задавать альтернативный текст в атрибуте alt, он помогает поисковым системам и экранным читалкам понимать, что на картинке.
Одиночный тег.
Примеры
Здесь указан атрибут srcset с указанием отдельного изображения для ретина-дисплеев, с плотностью пикселей 2x.
<img src="image.jpg" srcset="image@2x.jpg 2x" alt="Котики">Атрибуты
| Атрибут | Описание |
|---|---|
| src | Обязательный. Указывает адрес к изображению. Абсолютный или относительный. |
| alt | Альтернативный текст, который описывает изображение. Этот текст отображается, если изображение не загрузилось. Его видят роботы и экранные читалки. |
| width | Ширина изображения в пикселях. |
| height | Высота изображения в пикселях. |
| sizes | Один или несколько размеров через запятую для разных медиа-запросов. Например, чтобы для мобильных задать изображения меньшего размера, чем для ПК. Работает только в связке с srcset.Сначала идет медиа-запрос в скобках, например: (max-width: 600px), дальше идет пробел и ширина, которую будет занимать картинка в px, em или vw (проценты использовать нельзя). Последнее значение указывается без медиа-запроса, сразу ширина картинки. |
| srcset | Один или несколько адресов изображений через запятую для различных медиа-запросов. Сначала идет адрес изображения, дальше пробел и ширина картинки с буквой w (например, 480w) или плотность пикселей с буквой x (например, 2x). Может задавать отдельное изображение для ретина-экранов, если указать плотность 2x. |
| usemap | Название элемента <map> с символом # в начале. Например: #map. Используется для создания разных ссылок с разных областей картинки, например, на географической карте. |
| ismap | Логический атрибут (не имеет значения), который будет добавлять координаты, куда именно кликнули на изображении на сервер. Работает когда тег <img> обернут в ссылку <a>. Тогда к адресу в атрибуте href будут передаваться координаты в GET-запросе. Например, ?42,65, что будет обозначать координаты 42px по X и 65px по Y. |
Этот элемент поддерживает глобальные атрибуты.
