Html5--audio标签使用教程

audio标签简介
audio标签是网页中播放音频来使用的，audio是一个双标签

1.0 新建audio标签

用法:<audio src="url"></audio>
注意事项: 
 1. audio是一个双标签
 2. 目前audio支持三种音频格式
 	2.1: mp3文件的音频支持
 	2.2: ogg Vorbis文件的音频支持
 	2.3: Wav文件的音频支持
 3. audio标签在网页刚开始是不显示控件的(不可见),只有标签中添加
	'controls'属性,audio标签才可见。
 4.src里面存放音频路径
	

不同浏览器对audio标签文件的兼容性，参考W3c文档。

2.0 audio标签各种属性使用方法

1. controls属性
   用法:<audio src="小池塘.mp3" autoplay></audio>
   作用: 向用户显示控件，使音频标签可视。
   属性值:controls
2. autoplay属性
   用法:<audio src="小池塘.mp3" autuplay="autoplay"></audio>
   作用:打开浏览器,自动播放音频。
   属性值:autoplay
3. loop属性
   用法:<audio src="小池塘.mp3" loop="loop"></audio>
   作用:音频播放结束后,在次播放。
   属性值:loop
4. src属性
   用法:<audio src="小池塘.mp3" ></audio>
   作用:播放音频的路径。
   属性值:url(要播放的音频路径)。
5. src、autoplay、loop、controls四种属性可以写在一起
   用法:<audio src="小池塘.mp3" autoplay loop controls ></audio>
   注意: loop、autoplay、controls属性后面不跟属性值也是合法的,默认值为它们本身。

3.0 audio解决各种浏览器对音频的兼容方式

解决兼容:

<audio controls>
        <source src="public/胡永 - 我养你.mp3" type="audio/mpeg">
        <source src="public/胡永 - 我养你.ogg" type="audio/ogg">
            你的浏览器不兼容该文件的音频
    </audio>
    
    /*<source>标签介绍
    它是一个单表,为媒体标签。
    type是为了规定媒体文件MIME文件类型
    */

方法介绍:给一个audio标签多个音频,让浏览器取选择兼容的音频来播放，如果都不兼容，就会告诉用户(你的浏览器不兼容该文件的音频)。