Изображения, аудио и видео.
Изображения
Изображения часто присутствуют на HTML страницах, от простых аватарок до целых архивов фотографий.
Для того, чтобы вставить в страницу фотографию, используется тег <img/>и следующий синтаксис:
<img src="Ссылка на фото" атрибуты размеров и другие alt="Что должно быть выведено, если фото не будет загружено"/> (данный тег один из тех, что не требуют закрывания)
! Атрибуты размеров в теге <img/> нужны для того, что бы изображение заняло нужную часть страницы, а не отображалось в собственном размере
Обязателен атрибут "alt". Если Вы не хотите, чтобы что-то отображалось, если фото не загрузится, то оставьте пустым пространство между двойных кавычек (alt="").
Это всё, что нужно знать, что бы уметь вставлять изображения. Конечно, это далеко не всё, сто можно с ним сделать, но подробнее Вы сможете узнать позже на ккрсе по CSS.
Аудио
До появления HTML5, у браузеров небыло стандарта для проигрывателя аудио элементов. Веб-мастерам приходилось прописывать код самостоятельно. Но сейчас в HTML страницах можно просто использовать тег <audio> и два варианта записи:
1. <audio src="Ссылка на аудио элемент" controls>Что должно быть выведено, если аудио не поддерживается браузером</audio>
2. <audio controls>
<sourse src="Ссылка на аудио элемент" type="audio/расширение (.mp3=mpeg, .ogg=ogg и др варианты)">
<source src="Ссылка на тоже аудио элемент" type="audio/расширение">
</audio>
Первый вариант прост, и, я полагаю, не требует пояснений, но про второй расскажу подробней:
тег <source>...</source> как атрибут "src" (сокр. от source) загружает элемент по ссылке на страницу. Второй вариант необходим, если Вы не знаете формат (расширение) аудио элемента и используете несколько вариантов, что бы сработал хоты бы один (для одного расширения). В теге <source> прописывается атрибут "type" используется для указания типа файла.
Также элемент <audio> может включать в себя ещё два атрибута. Атрибут autoplay для автоматического воспроизведения аудио после загрузки страницы и атрибут loop для бесконечного востроизведения по кругу (<audio controls autoplay loop>).
Видео
Видео добавляется на HTML страницу точно также, как и аудио, за исключением пары моментов:
1. Вместо тега <audio> импользуется тег <video>.
2. Вместо типа audio (в атрибуте "type") используется тип video.
3. Вместо расширения mp3 используется расширение mp4.
Вот и всё. Вдобавок хочу сказать, что ссылка на элемент может быть не только интернет ссылкой (https://www...), но и ссылкой на изображение в Вашем компьютере (C:/...), но на других устройствах Ваше изображение не откроется.
Практика
Попробуйте самостоятельно загрузить несколько изображений, видео и аудио на свою HTML страницу. Удачи!
