音频

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. Vim编辑器基础

    Vim编辑器基础 vi:Visual Interface vim:VI iMproved Vim模式 1.编辑模式(命令模式) 只能下达命令,不能键入字符 2.输入模式 键入字符 3.末行模式 左下角 ...

  2. 记一次低级错误导致的mysql（111）

    今天下午配好的双主多从服务器,两台主机+主机内安装好的6台虚拟机,两台Mysql master各授权好其slave的远程登录,原本好端端的能远程登录,晚上回来时候就发现其中一台master登录不上其s ...

  3. Spring Cloud构建微服务架构（二）分布式配置中心

     注:此文不适合0基础学习者直接阅读,请先完整的将作者关于微服务的博文全部阅读一遍,如果还有疑问,可以再来阅读此文,地址:http://blog.csdn.net/sosfnima/article/d ...

  4. ubuntu12.04 ppa安装git

    PPA地址:https://launchpad.net/~git-core/+archive/ppa 支持所有的Ubuntu版本. 运行命令: sudo apt-add-repository ppa: ...

  5. Linux学习-X Server 配置文件解析与设定

    X server 的配置 文件都是预设放置在 /etc/X11 目录下,而相关的显示模块或上面提到的总总模块,则主要放置在/usr/lib64/xorg/modules . 比较重要的是字型文件与芯片 ...

  6. jmeter throughput controller

    工作方式:可以按规定次数执行,也可以选择按百分比执行,其中的百分比必须是10,20,30类似的整数. 使用场景:可以随机的去按百分比浏览网址. 以下是具体脚本:

  7. Java-一个数组中的元素复制到另一个数组

    public static void arraycopy(Object src,int srcPos,Object dest,int destPos,int length).其中五个参数分别表示为: ...

  8. 写iOS SDK注意事项

    转载http://www.devtang.com/blog/2015/01/31/write-sdk-tips/

  9. 令人惊叹的sublime text 3 插件

    1.Chinese​Localization------语言汉化.(新手必备) 2.SublimeTmpl------打开生成模板.(新手必备) 3.SublimeCodeIntel------代码自 ...

  10. AtCoder Grand Contest 021

    A - Digit Sum 2 Time limit : 2sec / Memory limit : 256MB Score : 300 points Problem Statement Find t ...