音频

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. webpack4搭建Vue开发环境笔记~~持续更新

    项目git地址 一.node知识 __dirname: 获取当前文件所在路径,等同于path.dirname(__filename) console.log(__dirname); // Prints ...

  2. CSS基础:block,inline和inline-block

    css的display属性是前端开发中非常常见的属性,本文简单介绍下其中比较常用的属性值,即block.inline和inline-block. HTML组件中呈现一片空白区域的组件都可当盒模型(bo ...

  3. vue 顶级组件

    快 有时候懒的把一些通用组件写到template里面去,而业务中又需要用到,比如表示loading状态这样组件. 如果是这样的组件,可以选择把组件手动初始化,让组件在整个app生命周期中始终保持活跃. ...

  4. 【android】安卓平台版本和API版本的对应关系

    安卓平台版本和API版本对应关系

  5. SolrCloud下DIH实践

    创建Collection 在/usr/local/solrcloud/solr/server/solr文件夹下创建coreTest文件夹 将/usr/local/solrcloud/solr/serv ...

  6. FIFO buffer 和普通buffer区别

    1.FIFO可以说一块具体的硬件存储设备,也可以说程序在内存中开辟的一段内存区域.而buffer往往就是一段缓冲的数据区域 2.FIFO的数据是先进先出的,而buffer没有这个限制,可以全局访问 3 ...

  7. re--读书笔记【转】

    原文链接 * 正则表达式入门 1.正则表达式的两种基本用途:搜索和替换. 2.正则表达式是一些用来匹配和处理文本的字符串. 小结:正则表达式是文本处理方面功能最强大的工具之一,正则表达式语言用来构造正 ...

  8. Centos启动时停止在登录界面但不显示登录信息(一直在转圈)

    进入单用户模式  执行 iscsiadm -m node -o delete,然后reboot

  9. LA 7072 Signal Interference 计算几何 圆与多边形的交

    题意: 给出一个\(n\)个点的简单多边形,和两个点\(A, B\)还有一个常数\(k(0.2 \leq k < 0.8)\). 点\(P\)满足\(\left | PB \right | \l ...

  10. mongodb的基本操作数据更新

    先启动服务器 查看数据库 选择数据库 删除数据库 插入信息 查看插入的表名 查看信息 修改表数据 修改指定信息,其他信息不改变 可以使不存在的命令进行修改并保存 修改多条数据 删除数据 删除表 查看集 ...