Школа программирования: Урок № 4 - Добавляем фото...
И в завершении проекта мы добавим изображение на наш сайт, для этого воспользуемся тегом "img", с атрибутом "src" и выведем фото под ранее написанным нами текстом и ссылкой.
<img> - (от англ. слова image — изображение) - это пустой тег, а это значит, что у него нет закрывающего тега (</img>), он необходим для отображения картинок на страницах сайта...
Поехали! Пишем тег:
<img>
Задаем параметры местонахождения нужного нам изображения (структура построения похожа на написание ссылки, как на прошлом уроке), в тег вписываем атрибут "src" со знаком "=":
<іmg src=>
src - (сокр. от англ. слова source - источник) — это атрибут и он тоже несет в себе дополнительную информацию — место расположения, к примеру, изображения на другом ресурсе...
Поэтому после знака "=" нам нужно указать URL-адрес расположения изображения, он может быть локальный (на твоем ПК) или виртуальный (на сайте), для этого:
1 - Переходим на любой сайт.
2 - Кликаем по картинке правой кнопкой мышки.
3 - Выбираем в выпадающем меню пункт ''Скопировать URL картинки''.
4 - Вставляем скопированные данные обрамлённые кавычками в тег, после знака ''='', так:
<img srс=''gravi.ru/izо/prо.jpg''>
Пишем в блокноте:
<!doctype html>
<p>Привет!</p>
<а href=''https://gravi.su''>Учись с нами!</а>
<img src="gravi.su/izo/pro.jpg">
Результат в браузере:
Привет!
Учись с нами!