Добавление изображения при помощи тега <img>

Изображение для записи. Тег <img>

Одиночный тег <img> подходит для добавления фотографий, логотипов, картинок постов, аватарок и всех изображений, которые не являются декоративными.

Важные атрибуты тега <img>

Атрибут src — путь к изображению.

Если изображение находится рядом с html-файлом, в атрибуте src прописывается название и формат изображения.

<img src="название и формат изображения">

<img src="image.jpg">

Проводник Windows

---------------------------------------------------------------------------------------------

В следующем примере изображение находится в папке images. Поэтому в атрибуте src прописывается следующее:

<img src="название папки/название и формат изображения">

<img src="images/image.jpg">

В зависимости от того, где находится изображение и формируется путь. Без этого атрибута не отобразится картинка.

Проводник Windows

__________________________________________________________________________________________

Атрибут alt — альтернативный текст. Если изображение не загрузится, будет виден текст с описанием, который был указан в нём.

<img src="название и формат изображения" alt="описание изображения">

<img src="image.jpg" alt="Важный котик отдыхает на дереве">

Отображение изображения в браузере

---------------------------------------------------------------------------------------------

Отображение текстового описания изображения в браузере, указанного в атрибуте alt.

Отображение альтернативного текста в браузере

__________________________________________________________________________________________

Атрибут width — ширина изображения.
Атрибут height — высота изображения.

<img src="название и формат изображения" alt="альтернативное описание изображения" width="ширина в пикселях" height="высота в пикселях">

<img src="image.jpg" alt="Важный котик отдыхает на дереве" width="350" height="350">

Отображение фотографии в браузере, добавленной при помощи тега <img> и с атрибутами width="350" height="350". Ширина и высота 350 пикселей.

Отображение фотографии в браузере

<img src="image.jpg" alt="Важный котик отдыхает на дереве" width="250" height="250">

Отображение фотографии в браузере, добавленной при помощи тега <img> и с атрибутами width="250" height="250". Ширина и высота 250 пикселей.

Отображение фотографии в браузере

Таким способом добавляется изображение в html при помощи тега <img>.