音频格式 Chrome Firefox IE9 Opera Safari
OGG 支持 支持 支持 支持 不支持
MP3 支持 不支持 支持 不支持 支持
WAV 不支持 支持 不支持 支持 不支持

一般提供ogg和mp3格式，就可以支持所有主流浏览器了。

<!DOCTYPE HTML>

<html>

<head>

		<title>测试各种浏览器支持的音乐格式</title>

</head>

<body>

<br />

<br />

<br />

 播放《庄心妍-一万个舍不得》：

<br />

<br />

<br />

		<audio controls="controls">

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

			<source src="song.m4a" type="audio/mpeg">

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

				你的浏览器不支持html5的audio标签

		</audio>

<br />

<br />

<br />

播放《曲婉婷-我的歌声里》

<br />

<br />

<br />

		<audio controls="controls">

			<source src="song2.ogg" type="audio/ogg">

			<source src="song2.mp3" type="audio/mpeg">

				你的浏览器不支持html5的audio标签

		</audio>

<br />

<br />

<br />

</body>

</html>

有朋友说苹果safari支持m4a格式，在iphone上测试不支持，支持播放mp3格式的.

进过测试，PC浏览器可以同时播放两个音乐，平板和手机只能播放一个。

音频格式知识普及：

Ogg：全称应该是OGGVobis(oggVorbis)是一种新的音频压缩格式，类似于MP3等的音乐格式。Ogg是完全免费、开放和没有专利限制的。OggVorbis文件的扩展名是.OGG。Ogg文件格式可以不断地进行大小和音质的改良，而不影响旧有的编码器或播放器。

MP3：是一种音频压缩技术，其全称是动态影像专家压缩标准音频层面3（Moving Picture Experts Group Audio Layer III），简称为MP3。它被设计用来大幅度地降低音频数据量。利用 MPEG Audio Layer 3 的技术，将音乐以1:10 甚至 1:12 的压缩率，压缩成容量较小的文件，而对于大多数用户来说重放的音质与最初的不压缩音频相比没有明显的下降。

WAV：为微软公司(Microsoft)开发的一种声音文件格式，它符合RIFF(Resource Interchange File Format)文件规范，用于保存Windows平台的音频信息资源，被Windows平台及其应用程序所广泛支持，该格式也支持MSADPCM，CCITT A LAW等多种压缩运算法，支持多种音频数字，取样频率和声道，标准格式化的WAV文件和CD格式一样，也是44.1K的取样频率，16位量化数字，因此在声音文件质量和CD相差无几！

各种关联：wav格式音质最好，但是文件体积较大。mp3压缩率较高，普及率高，音质相比wav要差。ogg与mp3在相同位速率(Bit Rate)编码的情况下，ogg体积更小，并且ogg是免费的不用交专利费（这点国人很中意）。

不同浏览器对于html5 audio标签和音频格式的兼容性的更多相关文章

  1. CEF3 HTML5 audio标签为什么不能播放mp3格式的音频文件

    CEF3 HTML5 audio标签 为什么不能播放mp3格式的音频文件   原因略.   解决方法: 找一个最新版的chrome ,我用的是24版本.路径 C:\Documents and Sett ...

  2. HTML5 <Audio/>标签Api整理（二）

    1.实例2: 相对较完整 Html代码: <style> #volumeSlider .slider-selection { background:#bababa; } </styl ...

  3. HTML5 <Audio>标签API整理(一)

    简单实例: <audio id="myAudio"></audio> <script> var myAudio = document.getEl ...

  4. HTML5 <Audio>标签API整理(三)

    一.浏览器支持 Internet Explorer 9+, Firefox, Opera, Chrome, 和 Safari 都支持 <audio> 元素. 注意: Internet Ex ...

  5. 让ie浏览器支持html5新标签的解决方法(使用html5shiv)

    没估计错的话旧版浏览器都是不识别这些新增的标签所以都是用行内元素来处理解决的,所以,有一个解决办法的突破口就是让它变成块状元素就不会处于同一行了,这样在新旧浏览器都是可以显示同样的效果,再者就是让浏览 ...

  6. HTML5 Audio标签方法和函数API介绍

    问说网 > 文章教程 > 网页制作 > HTML5 Audio标签方法和函数API介绍 Audio APIHTML5HTML5 Audio预加载 HTML5 Audio标签方法和函数 ...

  7. ios加载html5 audio标签用js无法自动播放

    html5 audio标签在ios 微信浏览器中是无法自动播放的,最近在做一个小的项目遇到这个问题,安卓和pc都是正常的,唯独ios不行,查阅了很多资料,找到了以下方法,也许不是最好用的方法,如果有更 ...

  8. 解决ie9以下浏览器对html5新增标签的不识别，并导致CSS不起作用的问题

    https://www.cnblogs.com/yangjie-space/p/4816279.html html5shiv.js和respond.min.js 做页面常用的东西,写这里用的时候省点去 ...

  9. 如何让旧浏览器支持HTML5新标签

    HTML5出现也不短了,很多网站的页面都进行了改版,为了降低代码量(不需要起太多的类名),提升加载速度,提高标签的语义性,因此,在网页中大量使用了section,article,header等HTML ...

随机推荐

  1. [转]linux将一个服务器上的文件或者文件夹复制到另一台服务器上

    本文转载自<linux 将一个服务器上的文件或者文件夹复制到另一台服务器上>,有时间实践一把 使用scp将一个Linux系统中的文件或文件夹复制到另一台Linux服务器上 复制文件或文件夹 ...

  2. uva 10891 区间dp+记忆化搜索

    https://vjudge.net/problem/UVA-10891 给定一个序列x,A和B依次取数,规则是每次只能从头或者尾部取走若干个数,A和B采取的策略使得自己取出的数尽量和最大,A是先手, ...

  3. DGA GAN——GAN在安全中的应用

    DGA的模型:https://github.com/Yuren-Zhong/DeepDGA CNN.LSTM.双向LSTM 论文可以看https://openreview.net/pdf?id=BJL ...

  4. 014——VUE中v-if语法在网站注册中的实际应用

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. Intent Flag启动模式P203

    Activity启动模式:点此查看 Intent intent = new Intent(); /** * Intent.FLAG_ACTIVITY_NEW_TASK * 使用一个新的Task来启动一 ...

  6. 函数声明提升机制在浏览器中的bug

    JavaScript 解释器中存在一种变量声明被提升(hoisting)的机制,也就是说变量(函数)的声明会被提升到作用域的最前面,即使写代码的时候是写在最后面,也还是会被提升至最前面. 但通过测试, ...

  7. html 压缩成一行

    文章java gulp-htmlmin 减少下载的时间

  8. 3.了解linux系统以及搭建学习环境

    目录: 1.linux的前世今生. 2.企业如何选择linux系统? 3.如何在虚拟机上安装linux系统?搭建学习环境. 1.linux的前世今生. 1).起源:先是贝尔实验室的Unix系统,因为各 ...

  9. 如何创建 Visual Studio 2017 RC 离线安装包

    创建 Visual Studio 的离线安装计划 首先下载相应版本的可执行文件,例如:vs_community.exe.vs_enterprise.exe 或 vs_professional 在 cm ...

  10. Kali Linux：使用nmap扫描主机

    nmap-Network Mapper,是著名的网络扫描和嗅探工具包.他同样支持Windows和OS X. 扫描开放端口和判断操作系统类型 先让我们ping一段地址范围,找到启动的主机: # nmap ...