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" ...
随机推荐
- JavaScript 中的dispatchEvent是怎么用的
https://zhidao.baidu.com/question/1859896201945858587.html https://www.cnblogs.com/playerlife/archiv ...
- 信息安全-攻击-XSRF:XSRF/CSRF 攻击
ylbtech-信息安全-攻击-XSRF:XSRF/CSRF 攻击 CSRF(Cross-site request forgery)跨站请求伪造,也被称为“One Click Attack”或者Ses ...
- jmeter 测试结果分析术语
label:定义http请求名称. samples:测试中一共发出的请求. average:平均响应时长.默认是单个request的平均响应时长. median:中位数,50%用户的响应时长. 90% ...
- 测开之路二十:比较v1和v2
根据V1和V2的版本号,如果v1>v2,返回1,如果v1<v2,返回-1,除此之外返回0 # 如果v1>v2,返回1,如果v1<v2,返回-1,除此之外返回0v1 = inpu ...
- Asp.Net Core 第06局:中间件
总目录 前言 本文介绍Asp.Net Core 中间件. 环境 1.Visual Studio 2017 2.Asp.Net Core 2.2 开局 第一手:中间件概述 1.中间件:添加到应用 ...
- Mybatis的分支选择和In循环
Mybatis的分支选择: <choose> <when test="patientNo != null and patientNo != ''"> and ...
- WEBRTC三种类型(Mesh、MCU 和 SFU)的多方通信架构
WebRTC 本身提供的是 1 对 1 的通信模型,在 STUN/TURN 的辅助下,如果能实现 NAT 穿越,那么两个浏览器是可以直接进行媒体数据交换的:如果不能实现 NAT 穿越,那么只能通过 T ...
- android 查看网络图片
public class MainActivity extends Activity { private EditText pathText; private ImageView imageView; ...
- mybatis-generator 代码自动生成插件
Hibernate 可以选择MyEclipse Datebase Explorer 或者是 Hibernate-tools 等工具来自动生成映射文件和实体类. mybatis 当然也要有!下面简单介绍 ...
- Bootstrap 网页实例
代码: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <met ...
