HTML5: HTML5 Audio(音频)
| ylbtech-HTML5: HTML5 Audio(音频) |
| 1.返回顶部 |
HTML5 Audio(音频)
HTML5 提供了播放音频文件的标准。
互联网上的音频
直到现在,仍然不存在一项旨在网页上播放音频的标准。
今天,大多数音频是通过插件(比如 Flash)来播放的。然而,并非所有浏览器都拥有同样的插件。
HTML5 规定了在网页上嵌入音频元素的标准,即使用 <audio> 元素。
浏览器支持





Internet Explorer 9+, Firefox, Opera, Chrome, 和 Safari 都支持 <audio> 元素.
注意: Internet Explorer 8 及更早IE版本不支持 <audio> 元素.
HTML5 Audio - 如何工作
如需在 HTML5 中播放音频,你需要使用以下代码:
实例
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
您的浏览器不支持 audio 元素。
</audio>
control 属性供添加播放、暂停和音量控件。
在<audio> 与 </audio> 之间你需要插入浏览器不支持的<audio>元素的提示文本 。
<audio> 元素允许使用多个 <source> 元素. <source> 元素可以链接不同的音频文件,浏览器将使用第一个支持的音频文件
音频格式及浏览器支持
目前, <audio>元素支持三种音频格式文件: MP3, Wav, 和 Ogg:
| 浏览器 | MP3 | Wav | Ogg |
|---|---|---|---|
| Internet Explorer 9+ | YES | NO | NO |
| Chrome 6+ | YES | YES | YES |
| Firefox 3.6+ | YES | YES | YES |
| Safari 5+ | YES | YES | NO |
| Opera 10+ | YES | YES | YES |
音频格式的MIME类型
| Format | MIME-type |
|---|---|
| MP3 | audio/mpeg |
| Ogg | audio/ogg |
| Wav | audio/wav |
HTML5 Audio 标签
| 标签 | 描述 |
|---|---|
| <audio> | 定义了声音内容 |
| <source> | 规定了多媒体资源, 可以是多个,在 <video> 与 <audio>标签中使用 |
| 2.返回顶部 |
| 3.返回顶部 |
| 4.返回顶部 |
| 5.返回顶部 |
| 6.返回顶部 |
![]() |
作者:ylbtech 出处:http://ylbtech.cnblogs.com/ 本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。 |
HTML5: HTML5 Audio(音频)的更多相关文章
- html5 的<audio> 音频 audio的“坑”
<audio>标签是html5的一个非常有意义的特性.告别的flash的时代.它的属性有: autoplay:音频就绪后马上播放 controls:出现该属性,向用户显示播放的控件. lo ...
- HTML5之Audio音频标签学习
HTML5中的新元素标签 src:音频文件路径. autobuffer:设置是否在页面加载时自动缓冲音频. autoplay:设置音频是否自动播放. loop:设置音频是否要循环播放. control ...
- 【HTML5】audio音频
当前,audio 元素支持三种音频格式: IE 9 Firefox 3.5 Opera 10.5 Chrome 3.0 Safari 3.0 Ogg Vorbis √ √ √ MP3 √ ...
- iphone在微信中audio 音频无法自动播放
问题: Html5的audio 音频在电脑端和android端都可以实现自动播放,在iphone上无法实现,下面针对的是微信浏览器里面的解决方法 html代码: <div id="au ...
- HTML5的Audio标签打造WEB音频播放器
目前,WEB页面上没有标准的方式来播放音频文件,大多数的音频文件是使用插件来播放,而众多浏览器都使用了不同的插件.而HTML5的到来,给我们提供了一个标准的方式来播放WEB中的音频文件,用户不再为浏览 ...
- html5 audio音频播放全解析
序 html5开启了一个新时代,因为它让浏览器本身变得不那么被动,audio api就是一个典型的列子,在html5还没确定之前,如果想要在网页上听音乐看视频唯一的办法就是用flash意思是当你没有给 ...
- HTML5 学习07——Video(视频)Audio(音频)
<video> 元素:提供了 播放.暂停和音量控件来控制视频. width 和 height 属性:控制视频的尺寸 <video> 与</video> 标签之间插入 ...
- html5中audio支持音频格式
HTML5 Audio标签能够支持wav, mp3, ogg, acc, webm等格式,但有个很重要的音乐文件格式midi(扩展名mid)却在各大浏览器中都没有内置的支持.不是所有的浏览器都支持MP ...
- 《HTML5》 Audio/Video全解
一.标签解读 <audio> 标签属性 <audio id="media" src="http://www.abc.com/test.mp3" ...
随机推荐
- Python 进阶_生成器 & 生成器表达式
目录 目录 相关知识点 生成器 生成器 fab 的执行过程 生成器和迭代器的区别 生成器的优势 加强的生成器特性 生成器表达式 生成器表达式样例 小结 相关知识点 Python 进阶_迭代器 & ...
- 1.Jmeter 快速入门教程(一) - 认识jmeter和google插件
Jmeter是免费开源的性能测试工具( 同时也可以用作功能测试,http协议debug工具 ). 在如今越来越注重知识产权的今天, 公司越来越不愿意冒着巨大的风险去使用盗版的商业性能测试工具. 但如 ...
- 网站设置成代理后,chrome chrome HTTP ERROR 502
在阿里云上设置CNAME代理后,发现www.xxxx.com出现502,但是http://xxxx.com却可以访问. ping了一下都可以,网上搜了搜原来和nginx.conf配置有关 配置如下,上 ...
- python基础类型(字典:dict)
字典的介绍: 字典(dict)Python中唯一的一个映射类型.他是以{}括起来的键值对组成,在dict中key是唯一的.在保存的时候,根据key来计算出一个内存地址,然后将key-value保存到这 ...
- config maven in intellij IDEA
Config maven in IDEA File ->Settings->Build,Execution.Deployment->build Too ...
- emqtt 分布集群及节点桥接搭建
目录 分布集群 emq@s1.emqtt.io 节点设置 emq@s2.emqtt.io 节点设置 节点加入集群 节点退出集群 节点发现与自动集群 manual 手动创建集群 基于 static 节点 ...
- 2019-8-31-Latex-公式速查
title author date CreateTime categories Latex 公式速查 lindexi 2019-08-31 16:55:58 +0800 2018-05-25 16:5 ...
- go语言从例子开始之Example18_1.结构体中定义方法
Go 支持在结构体类型中定义方法 . Example: package main import "fmt" type product struct{ name string num ...
- sublime text的快捷键
Ctrl + Shift + P:调出命令板(Command Palette)Ctrl + `:调出控制台Ctrl + Enter:在当前行下面新增一行然后跳至该行Ctrl + Shift + Ent ...
- 2019牛客多校第一场E ABBA 贪心 + DP
题意:问有多少个有(n + m)个A和(n + m)个B的字符串可以凑出n个AB和m个BA. 思路:首先贪心的发现,如果从前往后扫,遇到了一个A,优先把它看成AB的A,B同理.这个贪心策略用邻项交换很 ...
