Есть несколько способов загрузить картинку на ваш сайт.
Первый способ: нужно найти картинку которую вы хотите использовать, скопировать ее ссылку и вставить в код.
Второй способ: скачать картинку, положить ее в рабочую папку с вашим сайтом, и в коде указать к ней путь. Начнем.
В HTML нужно создать информационный блок и прописать следующую команду:
<div class="kot">
<img src="https://fanibani.ru/wp-content/uploads/2022/12/1617975830_18-p-kotyata-milie-i-pushistie-18.jpg">
</div>
"<img src="..." " дословный перевод, ссылка на картинку.
Но почему данный способ используют редко, не получится изменить рисунок, можно лишь сдвинуть его.
Должно получиться так:
Теперь попробуем загрузить фотографию с компьютера.
Что бы в будущем было удобно использовать картинки, создадим папку и назовем ее "IMG", загрузим в эту папку картинку.
Далее, в HTML удалим строку "img src", оставим только блок div.
В CSS напишем следующий код:
.kot{
background-image: url(/IMG/kot_img.jpg); \\здесь указываем путь к картинке.
max-width: 500px;
max-height: 500px;
width: 100%;
height: 100%;
}
Должно получиться так:
Рисунок не полного размера, так как указаны размеры 500 * 500 px.
Для того что бы картинку была меньше, необходимо ее уменьшить через фотошоп, или скачать другую картинку.
Если остались вопросы или есть что дополнить - пишите в комментарии.
Всего доброго!