Елемент <audio> (від англ. audio — звук) додає, відтворює та керує налаштуваннями аудіозапису на веб-сторінці. Шлях до файлу задається через атрибут src або вкладений елемент <source>. Всередині контейнера <audio> можна написати текст, який буде виводитися в браузерах, що не працюють з цим елементом.
Список кодеків, що підтримуються браузерами, наведено в табл. 1.
Кодок | ||||||
ogg/vorbis | 17 | 3 | 11.5 | 3.5 | ||
wav | 12 | 3 | 11.5 | 3.1 | 3.5 | |
mp3 | 9 | 12 | 3 | 15 | 3.1 | 22 |
AAC | 9 | 12 | 3 | 15 | 3.1 | 22 |
Для універсального відтворення в вказаних браузерах аудіо кодують за допомогою різних кодеків і додають файли одночасно через елемент <source>.
Синтаксис
<code data-language="html"><audio src="<адреса>"></audio> <audio> <source src="<адреса>"> </audio>
Закриваючий тег
Обов'язковий.
Атрибути
- autoplay
- Звук починає грати відразу після завантаження сторінки.
- controls
- Додає панель керування до аудіофайлу.
- loop
- Повторює відтворення звуку спочатку після його завершення.
- muted
- Вимкнення звуку під час відтворення музики.
- preload
- Використовується для попереднього завантаження аудіофайлу або його даних разом із завантаженням веб-сторінки.
- src
- Вказує шлях до файлу, що відтворюється.
Приклад
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>audio</title> </head> <body> <p>Олександр Клименков — Чотирнадцять</p> <audio controls> <source src="audio/music.ogg" type="audio/ogg; codecs=vorbis"> <source src="audio/music.mp3" type="audio/mpeg"> Тег audio не підтримується вашим браузером. <a href="audio/music.mp3">Скачайте музику</a>. </audio> </body> </html>
Результат прикладу в браузері IE показаний на мал. 1.
Мал. 1. Відтворення аудіофайлу
Примітка
Управління відтворенням аудіо відрізняється між браузерами за своїм виглядом але основні елементи збігаються. Це кнопка відтворення/паузи, довжина треку, минулий та сумарний час звучання, а також рівень гучності.
Специфікація
Специфікація | Статус |
---|---|
WHATWG HTML Living Standard | Живий стандарт |
HTML5 | Рекомендація |
Специфікація
Кожна специфікація проходить кілька стадій схвалення.
- Recommendation (Рекомендація) — специфікація схвалена W3C і рекомендована як стандарт.
- Candidate Recommendation (Можлива рекомендація) — група, яка відповідає за стандарт, задоволена, як він відповідає своїм цілям, але потрібна допомога спільноти розробників з реалізації стандарту.) — на цьому етапі документ представлений на розгляд Консультативної ради W3C для остаточного затвердження. та внесення поправок для розгляду спільнотою.
- Editor's draft (Редакторська чернетка) — чорнова версія стандарту після внесення змін до редакторів проекту.
- Draft (Чернетка специфікації) — перша чорнова версія стандарту.
Особняком стоїть живий стандарт HTML (Living) — він не дотримується традиційної нумерації версій, оскільки перебуває в постійній розробці та оновлюється регулярно.
Браузери
9 | 12 | 5 | 11.5 | 4.1 | 4 |
2.2 | 4 | 11 | 5 |
Браузери
У таблиці браузерів застосовуються такі позначення.
- — елемент повністю підтримується браузером;
- — елемент браузером не сприймається та ігнорується;
- — при роботі можлива поява різних помилок, або елемент підтримується з застереженнями.
Число вказує версію браузреа, з якої елемент підтримується.