(5)html音频视频
音频
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音频视频的更多相关文章
- iOS 直播-获取音频(视频)数据
iOS 直播-获取音频(视频)数据 // // ViewController.m // capture-test // // Created by caoxu on 16/6/3. // Copyri ...
- iOS 微信 音频 视频自动播放
iOS 微信 音频 视频自动播放 http://www.w3ctech.com/topic/1165
- 【转】android如何浏览并选择图片 音频 视频
转自:http://www.cnblogs.com/top5/archive/2012/03/06/2381986.html 这几天 在学习并开发android系统的图片浏览 音频 视频 的浏览 ...
- HTML5 音频视频
HTML5 视频和音频的 DOM 参考手册 HTML5 DOM 为 <audio> 和 <video> 元素提供了方法.属性和事件. 这些方法.属性和事件允许您使用 JavaS ...
- 第六十六节，htnl音频视频
htnl音频视频 学习要点: 1.音频和视频概述 2.video视频元素 3.audio音频元素 本章主要探讨HTML5中音频和视频元素,通过这两个原生的媒体元素向HTML页面 ...
- 前端笔记之HTML5&CSS3（上）新特性&音频视频&本地存储&自定义属性
一.HTML5简介 HTML 5 的第一份正式草案已于2008年1月22日公布.HTML5 仍处于完善之中.然而,大部分现代浏览器已经具备了某些 HTML5 支持. 2014年10月29日,万维网联盟 ...
- HTML5媒体（音频/视频）
摘要: 在HTML5出现之前,web媒体大部分通过Flash来实现.这种方式造成了文件大加载慢,影响网站性能,开发难度高,维护麻烦,不易扩展等.这就导致HTML5自己开始支持媒体功能.HTML5 DO ...
- 音频视频解决方案：GStreamer/ffmpeg/ffdshow/directshow/vfw
音频视频编程相关:GStreamer/ffmpeg/directshow/vfw linux和window下几种流行的音频视频编程框架作一个总结,防止自己迷惘,免于晕头转向. 一.GStreamer ...
- iOS 音频视频图像合成那点事
代码地址如下:http://www.demodashi.com/demo/13420.html 人而无信不知其可 前言 很久很久没有写点什么了,只因为最近事情太多了,这几天终于闲下来了,趁此机会,记录 ...
- iOS WKWebView 退出后停止播放音频/视频
带有<video>或者<audio>标签的H5网页在播放音频视频时,退出webview后不会自动停止播放,手动处理一下. 1.注入使网页停止音频.视频播放的JS代码(Swift ...
随机推荐
- lavarel 添加自定义辅助函数
Laravel 提供了很多 辅助函数,有时候我们也需要创建自己的辅助函数. 必须 把所有的『自定义辅助函数』存放于 bootstrap 文件夹中. 并在 bootstrap/app.php 文件的最顶 ...
- python的标准模块
本文用于记录python中的标准模块,随时更新. decimal模块(解决小数循环问题): >>> import decimal >>> a = decimal.D ...
- STM32——PWM基本知识及配置过程
将通用定时器分为四个部分: 1,选择时钟 2,时基电路 3,输入捕获 4,输出比较 本节定时器PWM输出主要涉及到定时器框图右下方部分,即输出比较部分 和上一讲相同,时基时钟来源于内部默认时钟 对此有 ...
- selenium2常用API介绍
我们模拟web操作都是基于元素来操作的,我们首先要先确定元素,然后这个元素下对应的方法就可以看WebElement的方法. 1.点击操作 WebElement button=driver.findEl ...
- MySQL 的MAC终端一些指令总结
开启MySQL服务 sudo /usr/local/mysql/support-files/mysql.server start 关闭MySQL服务 udo /usr/local/mysql/supp ...
- Ubuntu关机与重启的相关指令
将数据同步写入到磁盘中的指令:sync 惯用的关机指令:shutdown 重新启动,关机:reboot,halt,poweroff shutdown可完成如下工作: 1.可以自由选择关机模式:是要关机 ...
- luogu3808 luogu3796 AC自动机（简单版） AC自动机（加强版）
纪念一下我一晚上写了八遍AC自动机 这是加强版的: #include <iostream> #include <cstring> #include <cstdio> ...
- python中os和sys模块
os模块负责程序与操作系统的交互,提供了访问操作系统底层的接口;sys模块负责程序与python解释器的交互,提供了一系列的函数和变量,用于操控python的运行时环境. os 常用方法 os.rem ...
- python学习--同目录下调用 (*.py)及不同目录下调(*.py)
注:__init__.py 内容为空 1. 同目录下调用 (Contract_Statelog.py) 如图: temp1.py 调用 Contract_Statelog.py中的方法 2. 不同目 ...
- custom post types 404 Page Error
问题: 注册新的文章类型后,用新的类型写文章,打开后报 404 错误 原因: 因为虽然注册了新的帖子类型,但WordPress还不知道如何处理它 解决: 到设置 -> 固定链接,重新点击保存,再 ...