目前,web页面上没有标准的方式来播放音频文件,大多数的音频文件是使用插件来播放,而众多的浏览器使用了不同的插件。而html5的到来,给我们提供了一个标准的方式来播放web中音频文件,用户不再为浏览器升级adobe flash/apple quicktime等播放插件,只需使用现代浏览器就可以聆听任务发出声音的web网站。

html5中规定了一种通过audio元素来包含音频的标准方法.

audio元素能够播放声音文件或音频流。

<audio src="音频地址.mp3" controls="controls">
</audio>

以上就是audio的格式,与img格式相同用src源属性。支持的音频格式有三种分别是:ogg vorbis/mp3/wav/。

而controls属性供添加播放、暂停和音量的一个控件。

<audio controls="controls">
<source src="song.ogg" type="audio/ogg">
<source src="song.mp3" type="audio/mpeg">
</audio>

但不是所有格式都支持一个,所有一般都可以多添加几个,它们不会进行冲突。

属性:    值:    描述:

autoplay    autoplay    如果出现该属性,则音频在就绪后马上进行播放。

controls    controls    如果出现该属性,则向用户显示控件,比如播放按钮。

loop      loop       如果出现该属性,则每次音频播放结束后重新开始播放

preload    preload    出现该属性,则音频在页面加载时进行加载并预备播放。如设置了autoplay,则忽略该属性。

src      url      要播放的音频url

embed           src:地址    嵌入插件,

end

loopend

loopstart

playcount

start

html5 音频的更多相关文章

  1. HTML5 音频播放器-Javascript代码(短小精悍)

    直接上干货咯! //HTML5 音频播放器 lzpong 2015/01/19 var wavPlayer = function () { if(window.parent.wavPlayer) re ...

  2. html5音频视频专题

    html5音频视频专题 总结 1. 操作的就是video和audio两个对象,这两个对象有他们的属性和方法,通过对象的id就可以操作他们 <audio src="../video/琴箫 ...

  3. HTML5音频可视化频谱跳动代码

    今天学习到用canvas来写  HTML5音频可视化频谱跳动代码  将代码在此做一总结: <!DOCTYPE html> <html lang="en"> ...

  4. HTML5 音频 <audio>

    HTML5 提供了播放音频的标准. 一.Web 上的音频 直到现在,仍然不存在一项旨在网页上播放音频的标准. 今天,大多数音频是通过插件(比如 Flash)来播放的.然而,并非所有浏览器都拥有同样的插 ...

  5. html5音频和视频标签

    在html5之前的版本中如果想要在网页中插入音频和视频必须要安装插件才可以,比如最常见的flash插件.很多人在刚安装一款浏览器的时候都会遇到浏览器建议安装flash插件,在移动端也是如此.如果想要在 ...

  6. HTML5 音频视频

    HTML5 视频和音频的 DOM 参考手册 HTML5 DOM 为 <audio> 和 <video> 元素提供了方法.属性和事件. 这些方法.属性和事件允许您使用 JavaS ...

  7. html5 音频和视频(audio And video)

    1.音频和视频  Web 上的视频 直到现在,仍然不存在一项旨在网页上显示视频的标准. 今天,大多数视频是通过插件(比如 Flash)来显示的.然而,并非所有浏览器都拥有同样的插件. HTML5 规定 ...

  8. [html5] 学习笔记-html5音频视频

    HTML5 最大的新特色之一就是支持音频和视频.在 HTML5 之前,我们必须使用插件如 Silverlight  或 Flash 来实现这些功能.在 HTML5 中,可以直接使用新标签< au ...

  9. 移动端HTML5音频与视频问题及解决方案

    最近在研究用视频代替动画,用视频代替精灵动画,我们称这种视频叫做交互视频. 传统的精灵动画: 磁盘空间大,下载慢,尤其是在线播放,会更慢 文件太多,在线播放的时候,太多http请求,会导致响应慢,或者 ...

随机推荐

  1. Power Designer - 反向获取数据库物理模型时Unable to list the users 异常

    解决方案: 菜单栏 -> Database -> Change Current DBMS ,给DBMS选择Oracle Version 9i2.

  2. 实现VS2010整合NUnit进行单元测试

    1.下载安装NUnit(最新win版本为NUnit.3.2.1.msi) http://www.nunit.org/index.php?p=download 2.下载并安装VS的Visual Nuni ...

  3. BestCoder Round #36 (hdu5199)Gunner(水题)

    转载请注明出处: http://www.cnblogs.com/fraud/          ——by fraud Gunner Time Limit: 8000/4000 MS (Java/Oth ...

  4. vc2015编译protobuf

    下载地址:https://github.com/google/protobuf 1.编译通过cmake生成sln文件来编译用cmd命令 cd 到3.0.0-beta-4\cmake mkdir bui ...

  5. Git / Bower Errors: Exit Code # 128 & Failed connect

    今天第一次使用bower来安装插件,上来就报了这个错. 然后在google上查找,很多人都有做出回答,让执行如下 git config --global url.https://github.com/ ...

  6. 函数reduce,lambda,filter

    #比较时间差,判断执行有时. import time def panduan(x): if x%5==0 and x%7==0: return True else: return False star ...

  7. 每次从vss获取文件都是只读

    在 Visual Studio 2008 中,使用 VSS 作为源码管理器,把文件签入后,文件会自动变为只读状态.在公司习惯是在某个开发人员的机器上获取最新的代码后编译,编译完之后服务器上再从 VSS ...

  8. 关于svcutil.exe

    添加环境变量 name NETFX4 value C:\Program Files\Microsoft SDKs\Windows\v7.0A\bin\NETFX 4.0 Tools Server.Pr ...

  9. openssl对数组加密解密的完整实现代码

    本例是用C实现的对一个数组进行加密,加密到第二个数组,然后解密到另一个数组的完整实现代码. #include <stdio.h> #include <string.h> #in ...

  10. spserver 开源服务器框架研究与分析

    网上开源的C/C++服务器框架 还是比较少的. 最近研究了 spserver , 里面用了较多的设计模式,使用设计模式的目的是把不变的东西和可变的东西分离并且封装起来,避免以后修改代码, 应用设计模式 ...