HTML таг `audio`

Пример

Кратък пример как се използва тагът <audio>.

<audio controls>
  <source src="audio/sample.mp3" type="audio/mpeg">
  <source src="audio/sample.ogg" type="audio/ogg">
  Вашият браузър не поддържа аудио елемента.
</audio>

Опитай в редактора

Дефиниция и употреба

Тагът <audio> се използва за вграждане на аудио съдържание (музика, подкасти, звукови ефекти) в уеб страница. Той предоставя вграден плейър в браузъра и позволява контрол върху възпроизвеждането.

Най-често се използва с един или повече вътрешни елемента <source>, чрез които се задават различни аудио файлове и техните MIME типове. Браузърът избира първия формат, който поддържа.

Основни атрибути на <audio>:

src – директно задава път към аудио файла (алтернатива на вътрешните <source> елементи).
controls – показва стандартните контроли на плейъра (пускане, пауза, сила на звука, прогрес бар). Обикновено е задължителен за добра употребяемост.
autoplay – опитва да стартира аудиото автоматично при зареждане на страницата (често блокирано от браузърите, ако няма потребителско действие).
loop – при достигане на края, аудиото започва отначало автоматично.
muted – стартира аудиото без звук (полезно в комбинация с autoplay).
preload – указва как да се зарежда аудиото:
- none – не се зарежда предварително;
- metadata – зарежда се само информация (продължителност и др.);
- auto – браузърът може да зареди целия файл.

Между отварящия и затварящия таг <audio>...</audio> може да се постави резервен текст или линк за изтегляне, който ще се покаже в по-стари браузъри, които не поддържат елемента.

Browser Support

Browser	Поддръжка
Chrome	✔️
Firefox	✔️
Edge	✔️
Safari	✔️
Opera	✔️

Атрибути

Атрибут	Описание
`src`	Задава URL към аудио файла, който да се възпроизведе.
`controls`	Показва вградените контроли за възпроизвеждане (play, pause, volume и др.).
`autoplay`	Започва възпроизвеждането автоматично при зареждане на страницата (може да бъде блокирано от браузъра).
`loop`	Повтаря аудиото безкрайно – при край започва отначало.
`muted`	Стартира аудиото без звук (заглушено).
`preload`	Указва дали и как да се зарежда аудиото предварително: `none`, `metadata` или `auto`.
`controlslist`	Позволява скриване на определени контроли (напр. `nodownload`) в поддържаните браузъри.
`crossorigin`	Указва CORS поведение при зареждане на аудио от друг домейн (`anonymous` или `use-credentials`).

Тагове

a abbr address area article aside audio b base bdi bdo blockquote body br button canvas caption cite code col colgroup data datalist dd del details dfn dialog div dl dt em embed fencedframe fieldset figcaption figure footer form h1 h2 h3 h4 h5 h6 head header hgroup hr html i iframe img input ins kbd label legend li link main map mark menu meta meter nav noscript object ol optgroup option output p picture pre progress q rp rt ruby s samp script search section select selectedcontent slot small source span strong style sub summary sup table tbody td template textarea tfoot th thead time title tr track u ul var video wbr

HTML таг audio