音频

1、互联网常用的音频格式

ogg

有损的音频压缩技术

免费的开源音频格式

它可以在相对较低的数据速率下实现比MP3更好的音质

mp3

有损的音频压缩技术

想使用MP3格式发布自己的作品，需要付给发明MP3的公司专利使用费

wav

无损压缩，浏览器支持差

flac

无损压缩

aac

音效速率公式

音效速率水平≈容量（M）× 音效系数（C）÷音乐播放时间

音乐播放时间≈容量（M）× 音效系数（C）÷位速

音效系数每个格式是固定的，比如MP3的音效系数是136kbps/M

2、

格式：

<audio controls="controls">

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

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

3、

属性:

属性 值 描述
autoplay autoplay 如果出现该属性，则音频在就绪后马上播放。
controls controls 如果出现该属性，则向用户显示控件，比如播放按钮。
loop loop 如果出现该属性，则每当音频结束时重新循环开始播放。
preload preload

如果出现该属性，则音频在页面加载时进行加载，并预备播放。

如果使用 “autoplay”，则忽略该属性。
src url 要播放的音频的 URL。也可以使用<source>标签来设置音频。

谷歌

火狐

IE9

加载页面后自动、循环播放此URL连接里的音乐

<body>

    <audio controls="controls" autoplay="autoplay" loop="loop">

        <source src="http://www.w3school.com.cn/i/song.mp3" type="audio/mpeg">

</body>

去掉 controls="controls" 可以达到隐藏播放器的效果，这个挺有意思

<body>

    <audio autoplay="autoplay" loop="loop">

        <source src="http://www.w3school.com.cn/i/song.mp3" type="audio/mpeg">

</body>

视频

<body>

    <video width="800" height="600" controls>

        <source src="movie.mp4" type="video/mp4">

    </video>

</body>
属性 值 描述
autoplay autoplay 如果出现该属性，则视频在就绪后马上播放。
controls controls 如果出现该属性，则向用户显示控件，比如播放按钮。
height pixels 设置视频播放器的高度。
loop loop 如果出现该属性，则当媒介文件完成播放后再次开始播放。
muted muted 规定视频的音频输出应该被静音。
poster URL 规定视频下载时显示的图像，或者在用户点击播放按钮前显示的图像。
preload preload

如果出现该属性，则视频在页面加载时进行加载，并预备播放。

如果使用 "autoplay"，则忽略该属性。
src url 要播放的视频的 URL。
width pixels 设置视频播放器的宽度。

(5)html音频视频的更多相关文章

  1. iOS 直播-获取音频(视频)数据

    iOS 直播-获取音频(视频)数据 // // ViewController.m // capture-test // // Created by caoxu on 16/6/3. // Copyri ...

  2. iOS 微信 音频 视频自动播放

    iOS 微信 音频 视频自动播放 http://www.w3ctech.com/topic/1165

  3. 【转】android如何浏览并选择图片 音频 视频

    转自:http://www.cnblogs.com/top5/archive/2012/03/06/2381986.html   这几天 在学习并开发android系统的图片浏览 音频 视频 的浏览 ...

  4. HTML5 音频视频

    HTML5 视频和音频的 DOM 参考手册 HTML5 DOM 为 <audio> 和 <video> 元素提供了方法.属性和事件. 这些方法.属性和事件允许您使用 JavaS ...

  5. 第六十六节，htnl音频视频

    htnl音频视频 学习要点:     1.音频和视频概述     2.video视频元素     3.audio音频元素 本章主要探讨HTML5中音频和视频元素,通过这两个原生的媒体元素向HTML页面 ...

  6. 前端笔记之HTML5&CSS3（上）新特性&音频视频&本地存储&自定义属性

    一.HTML5简介 HTML 5 的第一份正式草案已于2008年1月22日公布.HTML5 仍处于完善之中.然而,大部分现代浏览器已经具备了某些 HTML5 支持. 2014年10月29日,万维网联盟 ...

  7. HTML5媒体（音频/视频）

    摘要: 在HTML5出现之前,web媒体大部分通过Flash来实现.这种方式造成了文件大加载慢,影响网站性能,开发难度高,维护麻烦,不易扩展等.这就导致HTML5自己开始支持媒体功能.HTML5 DO ...

  8. 音频视频解决方案：GStreamer/ffmpeg/ffdshow/directshow/vfw

    音频视频编程相关:GStreamer/ffmpeg/directshow/vfw linux和window下几种流行的音频视频编程框架作一个总结,防止自己迷惘,免于晕头转向. 一.GStreamer ...

  9. iOS 音频视频图像合成那点事

    代码地址如下:http://www.demodashi.com/demo/13420.html 人而无信不知其可 前言 很久很久没有写点什么了,只因为最近事情太多了,这几天终于闲下来了,趁此机会,记录 ...

  10. iOS WKWebView 退出后停止播放音频/视频

    带有<video>或者<audio>标签的H5网页在播放音频视频时,退出webview后不会自动停止播放,手动处理一下. 1.注入使网页停止音频.视频播放的JS代码(Swift ...

随机推荐

  1. 【MySQL】mac环境下使用navicat premium连接mysql乱码问题

    ---恢复内容开始--- 最重要的两点:使用navicat premium创建mysql连接和在mysql连接里面创建数据库时,需要注意. 1.创建连接时,Encoding不需要手动选择,保持Auto ...

  2. 19.Yii2.0框架模型删除记录

    目录 //删除记录 //http://yii.com/?r=home/del public function actionDel() { //查出要删除的记录行 // 方法一:(查一行,删一行) // ...

  3. Mysql数据库查询语法详解

    数据库的完整查询语法 在平常的工作中经常需要与数据库打交道 , 虽然大多时间都是简单的查询抑或使用框架封装好的ORM的查询方法 , 但是还是要对数据库的完整查询语法做一个加深理解 数据库完整查询语法框 ...

  4. Java-basic-6-方法

    命令行参数的使用 public class test { public static void main(String args[]) { for(int i = 0; i < args.len ...

  5. JdbcTemplate实验

    实验1:测试数据源 @Test public void test() throws SQLException { ApplicationContext ioc = new ClassPathXmlAp ...

  6. linux笔记（1）

    1)useradd+用户名 添加一个普通用户2)passwd+密码 为用户加密码3)su - 用户名 切换用户4)whoami 查看当前用户是什么5)$符号是普通用户#是超级用户6)mkdir /da ...

  7. 下载linaro android 4.4.2 for panda4460

    $ export MANIFEST_REPO=git://android.git.linaro.org/platform/manifest.git$ export MANIFEST_BRANCH=li ...

  8. HDU 3727 Jewel 主席树

    题意: 一开始有一个空序列,然后有下面四种操作: Insert x在序列尾部加入一个值为\(x\)的元素,而且保证序列中每个元素都互不相同. Query_1 s t k查询区间\([s,t]\)中第\ ...

  9. iframe内容刷新

    经常有嵌套的iframe的内容无法及时刷新,需要手动刷新,这时候就需要获取iframe,然后调用对象的reload, document.getElementById(iframe的id).conten ...

  10. [POJ 1001] Exponentiation C++解题报告 JAVA解题报告

        Exponentiation Time Limit: 500MS   Memory Limit: 10000K Total Submissions: 126980   Accepted: 30 ...