This article is the official HTML5 training course for Brother Lian it education organization, mainly introduces: HTML5 Mobile Development Road (--HTML5) audio
Although the browser development is very fast, but the standard in the browser is still imperfect, in the html4+css2+js of the development of the front to many programmers headache is the browser compatibility problem, audio playback is the same, until now, there is still no web page to play video and audio standards. Now, in most browsers, audio is played through plugins (such as Flash plugins). However, not all browsers have such plugins, so the audio playback caused some trouble. In the new standard for HTML5, which provides a standard way to include audio through the sound element, let's look at the label in more detail below.
I. Support for audio formats
Currently, the audio element supports three different formats
IE 9 Firefox 3.5 Opera 10.5 Chrome 3.0 Safari 3.0 Ogg Vorbis √ √ √ MP3 √ √ √ Wav √ √ √
Second, how to use
[HTML] view plain copy
Print? 650) this.width=650; "src=" Https://code.csdn.net/assets/CODE_ico.png "alt=" on Code View "Width=" "height=" 12 " Style= "border:0px;"/>650) this.width=650; "src=" Https://code.csdn.net/assets/ico_fork.svg "alt=" Derivation to My Code slice " Width= "height=" style= "border:0px;"/>
<! DOCTYPE HTML>
<html>
<body>
<audio src="Http://www2.shengda.edu.cn/ytw/gbzx/photo/bgmusic.mp3" controls= "controls ">
The HTML5 tag is not supported by your browser
</Audio>
</Body>
</html>
Click the Start button to play the song (in MP3 format, only for IE9 above and Chrome3.0 browser)
650) this.width=650; "Src=" http://img.blog.csdn.net/20140112125932921?watermark/2/text/ ahr0cdovl2jsb2cuy3nkbi5uzxqvzgf3yw5nyw5iyw4=/font/5a6l5l2t/fontsize/400/fill/i0jbqkfcma==/dissolve/70/gravity/ Southeast "style=" border:0px; "/>
Control property Displays the console
The content inserted between <audio> and </audio> is displayed for browsers that do not support the audio element.
To run other browsers also support is to use the following methods
[HTML] view plain copy
Print? 650) this.width=650; "src=" Https://code.csdn.net/assets/CODE_ico.png "alt=" on Code View "Width=" "height=" 12 " Style= "border:0px;"/>650) this.width=650; "src=" Https://code.csdn.net/assets/ico_fork.svg "alt=" Derivation to My Code slice " Width= "height=" style= "border:0px;"/>
<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>
Iii. properties of the audio tag
Properties value Description autoplay autoplay controls controls loop loop preload preload
Src Url The URL of the audio to play.
HTML5 Mobile Development Road (--HTML5) audio in
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
