音频

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. hive sql 学习笔记

    1.coalesce 语法: COALESCE ( expression [ ,...n ] ) 参数: expression 任何类型的表达式. 返回类型: 返回数据类型优先级最高的 express ...

  2. cols

    题目描述 请设计一个函数,用来判断在一个矩阵中是否存在一条包含某字符串所有字符的路径.路径可以从矩阵中的任意一个格子开始,每一步可以在矩阵中向左,向右,向上,向下移动一个格子.如果一条路径经过了矩阵中 ...

  3. leetcode-21-knapsack

    322. Coin Change Write a function to compute the fewest number of coins that you need to make up tha ...

  4. hdu-2553 N皇后问题（搜索题）

    在N*N的方格棋盘放置了N个皇后,使得它们不相互攻击(即任意2个皇后不允许处在同一排,同一列,也不允许处在与棋盘边框成45角的斜线上. 你的任务是,对于给定的N,求出有多少种合法的放置方法. Inpu ...

  5. Linux学习-进程管理

    为什么进程管理这么重要呢? 这是因为: 首先,我们在操作系统时的各项工作其实都是经过某个 PID 来达成的 (包括你的 bash 环境), 因此,能不能进行某项工作,就与该进程的权限有关了. 再来,如 ...

  6. CodeForces 379F 树的直径 New Year Tree

    题意:每次操作新加两个叶子节点,每次操作完以后询问树的直径. 维护树的直径的两个端点U,V,每次计算一下新加进来的叶子节点到U,V两点的距离,如果有更长的就更新. 因为根据树的直径的求法,若出现新的直 ...

  7. 认识Function.prototype.call

    一.前言                                大家先预计一下以下四个函数调用的结果吧! var test = function(){ console.log('hello w ...

  8. selenium - 常用元素操作

    # 3.常用元素操作 # 元素对象的获取ele = driver.find_element_by_XXX('定位表达式') # 获取元素的文本内容(返回值为元素的文本)ele.text # 获取元素的 ...

  9. PHP中define()和const定义常量的区别

    在PHP中可以通过define()和const两种方式定义常量可是在开发中我们应该什么时候用define()定义常量,什么时候用const定义常量? 这两种方式定义常量的主要区别是什么? 从5.3版本 ...

  10. [java开发篇][dom模块] 遍历解析xml

    http://blog.csdn.net/andie_guo/article/details/24844351 XML DOM节点树 XML DOM将XML文档作为树结构,树结构称为一个节点树.所有的 ...