HTML: Аудио
Ранее, для добавления аудио на HTML-страницу, необходимо было пользоваться специальными «расширениями», которые давали возможность встраивать на страницу аудио-плеер. Начиная со стандарта HTML5, данная возможность есть по умолчанию. Она реализуется с помощью тега <audio>.
Данный тег является парным и в самом простом случае выглядит так:
<audio src="путь_к_аудио-файлу" controls></audio>Атрибут controls добавляет элементы интерфейса для плеера. Каждый браузер реализует их по-своему, и единого стандарта на этот счёт нет
Тег <source>
При добавлении аудио на HTML-страницу важно помнить, что не все браузеры поддерживают одни и те же форматы аудио. Специально для этого существует вложенный тег source, в котором указываются пути на другие форматы аудио файлов. В таком случае браузер выберет тот, который поддерживается в настоящий момент. При такой разметке указывать src у тега <audio> необязательно.
<audio controls>
<source src="https://example.com/audio.mp3">
<source src="https://example.com/audio.ogg">
</audio>Задание
Добавьте аудио на страницу. Используйте следующие аудио файлы:
На всякий случай сделайте звук потише ;)
Полезное
Если используется один файл, то достаточно его указать в атрибуте
src. Если файлов несколько, то используйте теги<source>
HTML: Аудио
Ранее, для добавления аудио на HTML-страницу, необходимо было пользоваться специальными «расширениями», которые давали возможность встраивать на страницу аудио-плеер. Начиная со стандарта HTML5, данная возможность есть по умолчанию. Она реализуется с помощью тега <audio>.
Данный тег является парным и в самом простом случае выглядит так:
<audio src="путь_к_аудио-файлу" controls></audio>Атрибут controls добавляет элементы интерфейса для плеера. Каждый браузер реализует их по-своему, и единого стандарта на этот счёт нет
Тег <source>
При добавлении аудио на HTML-страницу важно помнить, что не все браузеры поддерживают одни и те же форматы аудио. Специально для этого существует вложенный тег source, в котором указываются пути на другие форматы аудио файлов. В таком случае браузер выберет тот, который поддерживается в настоящий момент. При такой разметке указывать src у тега <audio> необязательно.
<audio controls>
<source src="https://example.com/audio.mp3">
<source src="https://example.com/audio.ogg">
</audio>Задание
Добавьте аудио на страницу. Используйте следующие аудио файлы:
На всякий случай сделайте звук потише ;)
Полезное
Если используется один файл, то достаточно его указать в атрибуте
src. Если файлов несколько, то используйте теги<source>
Ваше упражнение проверяется по этим тестам
const { test } = require('tests');
test(({ query, expect }) => {
const element = query(document, 'audio');
expect(query(element, 'source:nth-child(1)')).to.exist;
expect(query(element, 'source:nth-child(2)')).to.exist;
});Решение учителя откроется через:
20:00
