- Главная»
- HTML-Шпаргалка»
- img
img
Поддержка браузеров
 IE |
 Opera |
 Chrome |
 Firefox |
 Safari |
|---|---|---|---|---|
| + | + | + | + | + |
Пример
Вставляем картинку:
<img src="angry.gif" alt="Angry face" />
Описание и использование
Тег <img> вставляет изображение в документ HTML.
Заметьте, что изображения технически не вставляются в страницу. На самом деле, изображения ссылаются на HTML страницы. Тег <img> создает контейнер для изображения.
У тега <img> два обязательных атрибута: src и alt.
Разница между HTML и XHTML
В HTML тег <img> не имеет закрывающего тега.
В XHTML тег <img> должен быть правильно закрыт.
Атрибуты "align", "border", "hspace", и "vspace" элемента img устарели и не поддерживаются в XHTML 1.0 Strict.
Советы и примечания
Совет: Атрибут alt используется как альтернативный текст в случае отсутствия изображения, а не как текст при наведении мышки. Для показа текста при наведении мышки на изображение используйте атрибут title. Вот так: <img src="angry.gif" alt="Angry face" title="Angry face" />.
Обязательные атрибуты
| Атрибут | Значение | Описание |
|---|---|---|
| alt | текст | Определяет альтернативный текст для изображения |
| src | URL | Определяет УРЛ изображения |
Необязательные атрибуты
| Атрибут | Значение | Описание |
|---|---|---|
| align | left right top middle bottom | Устарел. Используйте CSS |
| border | пиксели | Устарел. Используйте CSS |
| height | пиксели % | Определяет высоту изображения |
| hspace | пиксели | Устарел. Используйте CSS |
| ismap | ismap | Определяет изображение как карту изображение на стороне сервера. Очень редко используется. |
| longdesc | URL | Определяет путь к документу, который содержит длинное описание изображения |
| usemap | #название_карты | Определяет изображение как карту изображение на стороне сервера. |
| vspace | пиксели | Устарел. Используйте CSS |
| width | пиксели % | Определяет ширину изображения |
Стандартные атрибуты
| Атрибут | Значение | Описание |
|---|---|---|
| class | имя_класса | Определяет имя класса для элемента |
| dir | rtl ltr | Определяет направление текста для контента в элементе |
| id | id | Определяет уникальный id для элемента |
| lang | код_языка | Определяет код языка для контента в элементе |
| style | определение_стиля | Определяет инлайновый стиль для элемента |
| title | текст | Определяет дополнительную информацию об элементе |
| xml:lang | код_языка | Определяет код языка для контента в элементе, в XHTML документах |
Событийные атрибуты
| Атрибут | Значение | Описание |
|---|---|---|
| onabort | скрипт | Скрипт будет выполнен при проблеме с загрузкой изображения |
| onclick | скрипт | Скрипт будет выполнен при клике |
| ondblclick | скрипт | Скрипт будет выполнен при двойном клике |
| onmousedown | скрипт | Скрипт будет выполнен при нажатии кнопки мышки |
| onmousemove | скрипт | Скрипт будет выполнен при движении курсора мышки |
| onmouseout | скрипт | Скрипт будет выполнен, когда курсор мышки покинет пределы элемента |
| onmouseover | скрипт | Скрипт будет выполнен, когда курсор мышки находится над элементом |
| onmouseup | скрипт | Скрипт будет выполнен, когда кнопка мышки будет отпушена |
| onkeydown | скрипт | Скрипт будет выполнен при нажатии клавиши |
| onkeypress | скрипт | Скрипт будет выполнен при нажатии клавиши и последующего разжатия |
| onkeyup | скрипт | Скрипт будет выполнен при разжатии клавиши |
