Html5--audio标签使用教程

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

audio标签使用教程

    • 1.0 新建audio标签
    • 2.0 audio标签各种属性使用方法
    • 3.0 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属性
    用法:
    作用: 向用户显示控件,使音频标签可视。
    属性值:controls
  2. autoplay属性
    用法:
    作用:打开浏览器,自动播放音频。
    属性值:autoplay
  3. loop属性
    用法:
    作用:音频播放结束后,在次播放。
    属性值:loop
  4. src属性
    用法:
    作用:播放音频的路径。
    属性值:url(要播放的音频路径)。
  5. src、autoplay、loop、controls四种属性可以写在一起
    用法:
    注意: loop、autoplay、controls属性后面不跟属性值也是合法的,默认值为它们本身。

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

解决兼容:

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

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

你可能感兴趣的:(HTML,html5)