Привет всем! Сегодня мы изучим тег img. Вы можете добавлять изображения на свой сайт с помощью элемента img. Элементы img имеют открывающий тег без закрывающего тега. Элемент без закрывающего тега называется элементом void.
Добавьте элемент img под элементом p. Если добавить пустой тег img, то никакое изображение не будет отображаться в браузере.
Давайте теперь возьмем какую нибудь картинку (я предпочитаю сгенерировать новую с помощью нейросети) и сохраним её в папке нашего приложения (если вы ещё не создали отдельную папку для приложения, то её нужно создать и файл index.html, как и наша картинка, должны располагаться в этой папке. Теперь давайте в теге укажем имя нашей картинки, например так:
<img src="Cats_Image_1.png">
Ниже приведен полный код нашей страницы:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8" />
</head>
<body>
<main>
<h1>Приложение "Котята"</h1>
<h2>Фото котят</h2>
<!-- TODO: Фото берем по этой ссылке D:\Cats foto\ -->
<p>Все любят милых маленьких котят!</p>
<img src="Cats_Image_1.png">
</main>
</body>
</html>
Если вы всё сделали правильно, то после сохранения и открытия страницы в браузере вы увидите страничку, примерно как на скрине выше. Надеюсь, у вас все получилось.