html5用“<audio>”標(biāo)記播放音樂。audio標(biāo)簽用于在網(wǎng)頁(yè)文檔中表示音頻內(nèi)容，利用該標(biāo)簽，開發(fā)者可以在網(wǎng)站上插入一個(gè)音樂播放控件；語(yǔ)法“ <audio src="音頻文件地址"></audio>”。

本教程操作環(huán)境：windows7系統(tǒng)、HTML5版、Dell G3電腦。

html5用“<audio>”標(biāo)記播放音樂。

<audio>標(biāo)簽：用于在文檔中表示音頻內(nèi)容。利用它，你可以在你的個(gè)人網(wǎng)站上插入一個(gè)音樂播放器，放一首你喜歡的歌。

<audio src="music.mp3"></audio>

用法很簡(jiǎn)單，跟<video>標(biāo)簽一樣，屬性src指定音頻文件地址。

如果你僅僅這樣寫，頁(yè)面上不會(huì)看到有明顯的東西，<audio>標(biāo)簽?zāi)J(rèn)是隱藏的。

對(duì)于不支持<audio>標(biāo)簽的瀏覽器，會(huì)把標(biāo)簽的文本內(nèi)容顯示出來(lái)。

    <audio src="music.mp3">         別試了，是你的瀏覽器渣渣     </audio>

為了方便我們對(duì)音頻文件進(jìn)行控制，操作它的進(jìn)度、播放暫停、音量等等，我們可以給它添加controls屬性：

    <audio src="m.mp3" controls></audio>

用法跟<video>標(biāo)簽一樣。對(duì)于加上了controls屬性， 不同的瀏覽器會(huì)展示不同樣式的控制面板。

( chrome瀏覽器的音頻控制面板 )

( firefox瀏覽器的音頻控制面板 )

( IE瀏覽器的音頻控制面板 )

哪個(gè)好看就見仁見智了~~

跟<video>標(biāo)簽一樣，<audio>標(biāo)簽也有一個(gè)字標(biāo)簽：<source>。

它們的作用和用法都一樣，就是用來(lái)引入多個(gè)音頻，瀏覽器會(huì)選擇一個(gè)支持的音頻格式進(jìn)行加載，對(duì)于不支持<audio>標(biāo)簽的瀏覽器，<source>元素也可以作為瀏覽器不識(shí)別的內(nèi)容加入到文檔中。

    <audio>         <source src="music.mp3">         <source src="music.ogg">         <source src="music.wav">     </audio>

注：主流的音頻文件格式有：mp3、wav、ogg。不同的瀏覽器對(duì)三種格式支持程度不一樣。其中mp3格式支持度最好。

autoplay屬性：加載完成后，自動(dòng)播放。也非常簡(jiǎn)單、使用。

 <audio src="m.mp3" autoplay></audio>

loop屬性：顧名思義，循環(huán)播放。

<audio src="m.mp3" loop></audio>

preload屬性：用來(lái)控制音頻在什么時(shí)候進(jìn)行加載。

 <audio src="m.mp3" preload="auto"></audio>

對(duì)應(yīng)的值有3種：

• none：默認(rèn)不加載，等有需要的時(shí)候再加載。

• metadata：元數(shù)據(jù)，默認(rèn)不加載，但是可以提取該音頻的元數(shù)據(jù)信息。

• auto：自動(dòng)加載，網(wǎng)頁(yè)加載完就加載整個(gè)音頻。

muted屬性：靜音效果。

<audio src="m.mp3" muted></audio>

加了muted屬性，音頻即使在播放的時(shí)候，也是沒有聲音，除非用戶手動(dòng)調(diào)整控制面板的音量。