HTML5 Аудио
Аудио в Интернете
До появления стандарта HTML5 аудиофайлы можно было воспроизводить в веб-браузере лишь с помощью плагина (на подобие flash).
HTML5 элемент <audio> указывает стандартный способ встраивания аудио в веб-страницу.
Поддержка браузерами
Цифры в таблице определяют первую версию браузера, которая полностью поддерживает элемент <audio>.
| Элемент | |||||
|---|---|---|---|---|---|
| <audio> | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
HTML элемент <audio>
Чтобы воспроизвести аудиофайл в HTML, используйте элемент <audio>:
Пример
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Ваш веб-браузер не поддерживает элемент audio.
</audio>
Попробуйте сами »
HTML Аудио - Как это работает
Атрибут controls добавляет элементы управления звуком, такие как воспроизведение, пауза и громкость.
Элемент <source> позволяет указать альтернативные аудиофайлы, с которых браузер может выбирать. Браузер будет использовать первый распознанный формат.
Текст между <audio> и </audio> тегами будет отображаться лишь в браузерах, которые не поддерживают элемент <audio>.
HTML Аудио - Поддержка браузерами
В HTML5 есть три поддерживаемых аудиоформата: MP3, WAV и OGG.
Поддержка браузерами разных форматов:
| Браузер | MP3 | WAV | OGG |
|---|---|---|---|
| Edge/IE | YES | NO | NO |
| Chrome | YES | YES | YES |
| Firefox | YES | YES | YES |
| Safari | YES | YES | NO |
| Opera | YES | YES | YES |
HTML Аудио - Медиа типы
| Формат файла | Медиа тип |
|---|---|
| MP3 | audio/mpeg |
| OGG | audio/ogg |
| WAV | audio/wav |
HTML Аудио - Методы, свойства и события
HTML5 определяет методы, свойства и события DOM для элемента <audio>.
Это позволяет загружать, воспроизводить и приостанавливать аудио, а также устанавливать продолжительность и громкость.
Есть также события DOM, которые могут извещать вас, когда звук начинает воспроизводиться, приостанавливаться и т.д.
Для получения полной справки на DOM перейдите к HTML5 Аудио/Видео DOM Справочника.
HTML5 Аудио теги
| Тег | Описание |
|---|---|
| <audio> | Определяет звуковой (аудио) контент |
| <source> | Определяет множество мультимедийных ресурсов для элементов медиа, таких как <video> и <audio> |

