Внимание! На этой странице вы найдете материал урока из архивного курса по HTML. Курс был написан в 2015, обновлен в 2024 году и по-прежнему актуален для начинающих веб-разработчиков.
Теоретический материал сохранен в исходном виде, а практические задания с автоматической проверкой вынесены в отдельные роадмапы.
Полный список уроков доступен по тегу Архивный курс по HTML и на странице первого урока.
В предыдущем уроке познакомились с элементом <canvas>, который создает холст для рисования.
До появления HTML5 и flash было тяжело вставить аудио на страницу. С появлением flash стали использовать его для вставки аудио на страницу. Вместе с HTML5 появился тег audio, благодаря которому легко можно вставить аудио на страницу.
В примере ниже показано, как добавить аудио файл на страницу HTML:
<audio src = "click.mp3"></audio>Вставить музыку также просто, как и вставить картинку в HTML страницу. В атрибут src указывается путь к файлу.
Некоторые форматы поддерживают не все браузеры, поэтому можно поступить следующим образом:
<audio>
<source src = "click.mp3">
<source src = "click.ogg">
</audio>Если хотите воспроизведение звука при открытии страницы, добавьте атрибут autoplay.
<audio autoplay>
<source src = "click.mp3">
<source src = "click.ogg">
</audio>Многих (всех у кого включен звук) раздражает самовоспроизводящийся звук!
Можем добавить кнопки управления, для этого используем атрибут controls.
<audio controls>
<source src = "click.mp3">
<source src = "click.ogg">
</audio>А еще можем зациклить аудио на нашей HTML-странице. Для этого указываем атрибут loop.
<audio loop>
<source src = "click.mp3">
<source src = "click.ogg">
</audio>В этом уроке мы научились вставлять аудио на HTML-страницу, указывать несколько форматов для различных браузеров и познакомились с атрибутами autoplay, controls и loop. В следующем уроке будем вставлять видео на веб-страницу.
Переходите к следующему уроку курса, а так же не забудьте посмотреть новый материал на Codebra по тегу HTML.
