audio标签
实例
一段简单的 HTML 5 音频:
<audio src="someaudio.wav">
您的浏览器不支持 audio 标签。
</audio>
浏览器支持
IE | Firefox | Chrome | Safari | Opera |
---|---|---|---|---|
Internet Explorer 9+, Firefox, Opera, Chrome 以及 Safari 支持 <audio> 标签。
注释:Internet Explorer 8 以及更早的版本不支持 <audio> 标签。
定义和用法
<audio> 标签定义声音,比如音乐或其他音频流。
HTML 4.01 与 HTML 5 之间的差异
<audio> 标签是 HTML 5 的新标签。
提示和注释
提示:可以在开始标签和结束标签之间放置文本内容,这样老的浏览器就可以显示出不支持该标签的信息。
属性
new : HTML5 中的新属性。
属性 | 值 | 描述 |
---|---|---|
autoplay | autoplay | 如果出现该属性,则音频在就绪后马上播放。 |
controls | controls | 如果出现该属性,则向用户显示控件,比如播放按钮。 |
loop | loop | 如果出现该属性,则每当音频结束时重新开始播放。 |
muted | muted | 规定视频输出应该被静音。 |
preload | preload |
如果出现该属性,则音频在页面加载时进行加载,并预备播放。 如果使用 "autoplay",则忽略该属性。 |
src | url | 要播放的音频的 URL。 |
audio标签的更多相关文章
- HTML5的Audio标签打造WEB音频播放器
目前,WEB页面上没有标准的方式来播放音频文件,大多数的音频文件是使用插件来播放,而众多浏览器都使用了不同的插件.而HTML5的到来,给我们提供了一个标准的方式来播放WEB中的音频文件,用户不再为浏览 ...
- 论HTML5 Audio 标签歌词同步的实现
HTML5草案里面其实有原生的字幕标签(<track> Tag)的,但使用的是vtt格式的文件,非常规的字幕(.sub, .srt)或歌词文件(.lrc). 用法如下(代码来自W3Scho ...
- 关于HTML5音频——audio标签和Web Audio API各平台浏览器的支持情况
对比audio标签 和 Web Audio API 各平台浏览器的支持情况: audio element Web Audio API desktop browsers Chrome 14 Yes ...
- 使用audio标签播放音频文件
HTML5定义了一个新的元素用来指定标准的方式来插入音频文件到web页面中:<audio>标签.使用audio标签可以控制音频的播放与停止,循环播放与播放次数设置,以及播放位置等等. 例如 ...
- H5页面实现一个Audio标签加载多个音频文件,并进行播放和展示音频长度
最近微信项目中有需求,要将微信端发送过来的amr格式的语音文件,在项目中的页面上进行展示和播放,实现方式如下: 1.首先java后台收到微信端的消息推送的时候,使用 ffmpeg将amr格式的音频文件 ...
- <video>和<audio>标签
一.<video>基本格式: <video width=" " heigh="" src=""> </vide ...
- HTML5 <Audio/>标签Api整理(二)
1.实例2: 相对较完整 Html代码: <style> #volumeSlider .slider-selection { background:#bababa; } </styl ...
- HTML5 <Audio>标签API整理(一)
简单实例: <audio id="myAudio"></audio> <script> var myAudio = document.getEl ...
- 关于HTML5中audio标签在手机中的autoplay
这个问题是我最头疼的: 问题描述:在开发手机网页的时候,苹果和三星的一些浏览器不能自动开始播放 解决办法:在这个页面上弹出一个层来触发audio标签的play()方法,或者你还可以 谷歌一下----& ...
- <audio> 标签简介
定义和用法 <audio> 标签定义声音,比如音乐或其他音频流. 实例 一段简单的 HTML 5 音频: <audio src="someaudio.wav"&g ...
随机推荐
- 编译器报错:'IHTMLControlElement' : redefinition
由于我安装了platform SDK,编译导致错误: error C2367: 'IHTMLControlElement' : redefinition; different uuid specifi ...
- eclipse中使用Maven管理java工程设置jdk版本为jdk1.8
使用Maven管理Java工程时,maven可以自动下载工程中依赖的jar包,这对于大型的项目非常方便.但在初次使用eclipse新建maven工程时遇到一些问题,我的jdk安装的是1.8版本,在配置 ...
- Json安全
1.不要使用顶级JSON数组,避免被<script>标签引用. 2.使用POST+密钥获取JSON,尽量不要用GET方式. 3.不要使用eval()将对象放入内存,eval()会执行所传入 ...
- Python常用排序算法
1.冒泡排序 思路:将左右元素两两相比较,将值小的放在列表的头部,值大的放到列表的尾部 效率:O(n²) def bubble_sort(li): for i in range(len(li)-1): ...
- IT类非开发面试总结--2
面试总结.. ================================= 第一部分..(自己对公司的最低要求) 面试需要提前准备的是:<想好自己以后要干嘛--我在想我以后要干嘛> ...
- python的eval函数
eval函数介绍:将字符串str当成有效的表达式来求值并返回计算结果.语法: eval(source[, globals[, locals]]) -> value参数: source:一个Pyt ...
- 重拾java中的 i++ 和 ++i
java中的 i++ 和 ++i 首先记着要点: 1.i++是先取值再运算. 2.++i是先运算后取值. 举个栗子: int y,x=3;y=(++x)+(++x); 则y=? 分析:先运算后取值,先 ...
- 横排列表(li)的左右对齐
效果如下: HTML代码如下: <div class="overdiv"> <ul> <li>1</li> <li>2& ...
- MongoDB Native Node.js Driver
写在前面 最近读<node.js学习指南>,对于mongodb没有介绍太多的工作原理,但是对于一个前端开发者,即使你还没有用过这种数据库也可以让你很好的理解和使用 一本非常好的 ...
- java-生产者消费者模式
经常会有公司叫我们手撕代码,比如网易,阿里,那我们是不是该掌握下呢.下面这段代码来自<现代操作系统>进程与线程P49页. public class ProducerConsumer { p ...