在HTML5标准网页里面,我们能够运用audio标签来完毕我们对声音的调用及播放。

下面是最常常见到的运用HTML5三种基本格式:

1.最少的代码

<audio src="song.ogg" controls="controls"></audio>

2.带有不兼容提醒的代码

<audio src="song.ogg" controls="controls">
Your browser does not support the audio tag.
</audio>

3.尽量兼容浏览器的写法

<audio controls="controls">
<source src="song.ogg" type="audio/ogg">
<source src="song.mp3" type="audio/mpeg">
Your browser does not support the audio tag.
</audio>

HTML5音频格式

当前,HTML5 Audio标签支持三种格式的音频,各自是wav mp3和ogg格式。

而眼下主流浏览器对他们的支持例如以下:

IE 9 Firefox 3.5 Opera 10.5 Chrome 3.0 Safari 3.0
Ogg Vorbis
MP3
Wav

IE8以及IE8下面不支持HTML5的audio标签。

HTML 5 Audio属性

  1. autoplay:唯一可选值为autoplay。出现autoplay属性并准确赋值时,音频将会自己主动播放
  2. controls:唯一可选值为controls。出现controls属性并准确赋值时,音频播放控件将会显示,控件包含:播放、暂停、定位、音量、全屏切换、字幕(假设可用)、音轨(假设可用)。
  3. loop:唯一可选值为loop。出现loop属性并准确赋值时,音频将会循环播放。
  4. preload:可选值有auto(当页面载入后载入整个音频)、meta(当页面载入后仅仅载入元数据)和none(当页面载入后不载入音频) 假设设置了前面的autoplay属性,那么preload将会被忽略。
  5. src:指定音频URL地址。能够是相对的URL也能够是绝对的URL 当然还能够像第2和第3个样例一样,用source标签来指定源。

HTML 5 音频Audio的更多相关文章

  1. JavaScript多个音频audio标签,点击其中一个播放时,其他的停止播放

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 不常用但是又得有的一个标签——音频(audio)

    这几天做一个项目里面出现了H5的一个标签,音频(audio),可以说这是我第一次遇见这种标签基本上很少用的,也许是我做的项目少吧, 下面我来说一下我的思路,当然这是我自己想的,当时我想到的是如何让一个 ...

  3. JS指定音频audio在某个时间点进行播放,获取当前音频audio的长度,音频时长格式转化

    前言: 今天接到一个需求,需要获取某个.mp3音频文件的时间长度和指定音频audio在某个时间点进行播放(比如说这个视频有4分钟,我要让它默认从第2秒的时候开始播放),这里当然想到了H5中的audio ...

  4. HTML5 音频 <audio>

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

  5. HTML 5 音频(audio)

     audio 元素支持三种音频格式 IE 9 Firefox 3.5 Opera 10.5 Chrome 3.0 Safari 3.0 Ogg Vorbis   √ √ √   MP3 √     √ ...

  6. HTML5视频Video 音频Audio

    视频协议 视频格式 Flash HTML5 HTTP flv HTTP f4v HTTP mp4 HTTP m3u8 HTTP webm HTTP ogg RTMP flv RTMP f4v RTMP ...

  7. 加载音频Audio

    var cameraAudio = new Audio(); cameraAudio.src = 'camera.wav'; // 设置音频对象的属性,预加载视频 var options_audio ...

  8. html5 的<audio> 音频 audio的“坑”

    <audio>标签是html5的一个非常有意义的特性.告别的flash的时代.它的属性有: autoplay:音频就绪后马上播放 controls:出现该属性,向用户显示播放的控件. lo ...

  9. html5学习(二)音频audio

    音频格式 当前,audio 元素支持三种音频格式:   IE 9 Firefox 3.5 Opera 10.5 Chrome 3.0 Safari 3.0 Ogg Vorbis   √ √ √   M ...

  10. HTML5无插件多媒体Media——音频audio与视频video

    文件日志地址  http://blog.csdn.net/q1056843325/article/details/60336226 音频与视频现在已经变得越来越流行 各个网站为了保证跨浏览器的兼容性 ...

随机推荐

  1. iOS-android-windowsphone等移动终端平台开发流程图

    到了公司后,半个月时间就是在熟悉下面这张图里的流程, 项目流程图:     下面是我对这张图的一些理解:        

  2. 安装python 科学计算库

    http://www.softpedia.com/get/Programming/Other-Programming-Files/Python-x-y.shtml Pythonxy兴趣小组QQ群237 ...

  3. glOrthof 与glFrustumf

    http://www.java123.net/v/533543.html glViewport()函数和glOrtho()函数的理解(转) 在OpenGL中有两个比较重要的投影变换函数,glViewp ...

  4. Linux的系统级性能剖析工具-perf

    一直在找个靠谱且易用的性能分析工具,perf 貌似是很符合要求的,先给出阿里整理的几篇文档: Linux的系统级性能剖析工具-perf-1.pdf Linux的系统级性能剖析工具-perf-2.pdf ...

  5. postgres 基本使用

    postgres=# help 您正在使用psql, 这是一种用于访问PostgreSQL的命令行界面 键入: \copyright 显示发行条款 \h 显示 SQL 命令的说明 \? 显示 pgsq ...

  6. 腾讯微信支付,程序员是如何让jQuery代码付钱的

    微信支付和支付宝支付已经是我们生活中不可确实的两个金融软件了,也是必备的,小编认为小钱用微信,大钱用支付宝. 下面这个图是我们生活中用腾讯微信支付平台的最后一个页面,大家想不想知道这个页面是如果做出来 ...

  7. js-限制参与活动的范围(微信H5活动)

    近期接到大连某个项目,一个H5的活动,其中有一个需求就是:这个活动的参与者仅限大连地区的用户 所以参考了微信API 得出的操作结果为: wx.ready(function() { wx.getLoca ...

  8. #424 Div2 C

    #424 Div2 C 题意 给出 k 个分数,初始分数未知,按顺序把这 k 个分数加到初始分数上,已知 n 个加入分数后的结果(无序),问初始分数有多少种可能. 分析 也就是说这 n 个结果,它们之 ...

  9. Git从入门到速成

    什么是Git Git是Linux发明者Linus开发的一款新时代的版本控制系统,那什么是版本控制系统呢?怎么理解?网上一大堆详细的介绍,但是大多枯燥乏味,对于新手也很难理解,这里我只举几个例子. 熟悉 ...

  10. docker环境准备及理论

    1.预热 内核运行在内核空间,进程运行在用户空间,linux进程特性:父进程负责子进程的创建和回收,白发人送黑发人.容器就是为了保护它里面的内容物,不受其他容器干扰,也不去干扰其他容器.容器让进程认为 ...