⇐ Назад
В главное меню
Продолжить ⇒
Прогресс завершения курса:

Тег <img>

Тег <img> используется для вставки изображения. Он содержит только атрибуты и не требует закрывающего тега.

Ссылка на изображение (веб-адрес) добавляется с помощью атрибута src.

Синтаксис для добавления изображения выглядит следующим образом:


<img src="image.jpg">

Атрибут alt устанавливает альтернативный текст для изображений, отображающийся при наведении на них курсора или же выводящийся на месте изображения, если оно по какой-то причине не отобразится на странице.

Местоположение изображения

Местоположение изображения указывается между кавычками атрибута src.

Если у Вас, к примеру, фотография с названием "picture.jpg", которая находится в одной папке с HTML-файлом, код будет выглядеть следующим образом:

<html>
<head>
<title>Первая страница</title>
</head>
<body>
<img src="picture.jpg">
</body>
</html>

Изменение размера изображения

Для указания размера изображения используются атрибуты width и height.

Размер может быть указан в px, % или em:

<html>
<head>
<title>Первая страница</title>
</head>
<body>
<img src="picture.jpg" width="150px" height="150px">
</body>
</html>

Загрузка изображений требует времени.
Помните: использование изображений больших размеров может значительно замедлить загрузку Вашей страницы!

Рамка вокруг изображения

По умолчанию изображение не имеет рамки.

Рамка добавляется с помощью атрибута border, который помещается внутрь тега изображения:

<img src="picture.jpg" height="150px" width="150px" border="1px">

Помимо изображений, рамку могут иметь и множество других тегов.


⇐ Назад
В главное меню
Продолжить ⇒