Home >Web Front-end >HTML Tutorial >HTML5 Tutorial - Audio

HTML5 Tutorial - Audio

黄舟
黄舟Original
2016-12-27 15:26:431502browse

Currently, there is no standard way to play audio files on WEB pages. Most audio files are played using plug-ins, and many browsers use different plug-ins.

The arrival of HTML5 has provided us with a standard way to play audio files in the WEB. Users no longer need to upgrade their browsers such as Adobe Flash, Apple QuickTime and other playback plug-ins. They only need to use modern browsers. You can listen to any WEB website that can make sounds. Next, this article will introduce to you the HTML5 tutorial-audio. Friends who are front-end developers, hurry up and learn!

HTML5 provides a standard for playing audio.

Audio on the Web

Until now, there was no standard for playing audio on web pages.

Today, most audio is played through plug-ins (such as Flash). However, not all browsers have the same plugins.

HTML5 specifies a standard way to include audio through the audio element.

The audio element can play sound files or audio streams.

Audio formats

Currently, the audio element supports three audio formats:

HTML5 Tutorial - Audio

How it works

If you need To play audio in HTML5, all you need is: The

<audio src=”song.ogg” controls=”controls”>
</audio>

control attribute to add play, pause and volume controls.

The content inserted between is for display by browsers that do not support the audio element:

Example:

<audio src=”song.ogg” controls=”controls”>
Your browser does not support the audio tag.
</audio>

Above The example uses an Ogg file and is suitable for Firefox, Opera and Chrome browsers.

To ensure that it works with Safari, the audio file must be of MP3 or Wav type.

The audio element allows multiple source elements. The source element can link different audio files. The browser will use the first recognized format:

Example:

<audio controls=”controls”>
<source src=”song.ogg” type=”audio/ogg”>
<source src=”song.mp3″ type=”audio/mpeg”>
Your browser does not support the audio tag.
</audio>

Internet Explorer

Internet Explorer 8 does not support the audio element. In IE 9, support for the audio element will be provided.


HTML5 Tutorial - Audio

## The above is the content of HTML5 tutorial-audio, more related Please pay attention to the PHP Chinese website (www.php.cn) for content!



Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn