HTML 5 视频
HTML 5 视频
=======================================================================================
如今这个网络时代,视频是随处可见,我们都对它非常的熟悉,可是在html5中视频是用的什么样的便签呢?如何工作的呢?让我为大家简单的解释一下吧!
=======================================================================================
= video 元素
= 在了解之前,我们先看看这个
= 视频格式
=当前,video 元素支持三种视频格式:
| 格式 | IE | Firefox | Opera | Chrome | Safari | 
|---|---|---|---|---|---|
| Ogg | No | 3.5+ | 10.5+ | 5.0+ | No | 
| MPEG 4 | 9.0+ | No | No | 5.0+ | 3.0+ | 
| WebM | No | 4.0+ | 10.6+ | 6.0+ | No | 
= Ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件
= MPEG4 = 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件
= WebM = 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件
=======================================================================================
实例分析:
<video src="movie.ogg" controls="controls">
</video>
control 属性供添加播放、暂停和音量控件。src属性连接文件
=====================================================================================
其它的属性和属性值:
| autoplay | autoplay | 如果出现该属性,则视频在就绪后马上播放。 | 
| controls | controls | 如果出现该属性,则向用户显示控件,比如播放按钮。 | 
| height | pixels | 设置视频播放器的高度。 | 
| loop | loop | 如果出现该属性,则当媒介文件完成播放后再次开始播放。 | 
| preload | preload | 如果出现该属性,则视频在页面加载时进行加载,并预备播放。 如果使用 "autoplay",则忽略该属性。 | 
| src | url | 要播放的视频的 URL。 <source src="movie.ogg" type="video/ogg">代替src | 
| width | pixels | 设置视频播放器的宽度。 | 
好了,有了这些基本的东西就可以生成我们大家熟悉的一个小视频了.
=======================================================================================
HTML 5 视频的更多相关文章
- 【腾讯bugly干货分享】HTML 5 视频直播一站式扫盲
		本文来自于腾讯bugly开发者社区,非经作者同意,请勿转载,原文地址:http://bugly.qq.com/bbs/forum.php?mod=viewthread&tid=1277 视频直 ... 
- premere cs4绿色版 安装 并且 视频导出 讲解
		最近室友,开始在玩视频剪辑,用的是 premere cs4 绿色版.让他遇到的最大问题也是我之前遇到的最大问题,就是视频导出. 所以我在这里上传一套自己的一点点经验吧. 接下来,我就总结一下 我是怎么 ... 
- Power BI官方视频(3)  Power BI Desktop 8月份更新功能概述
		Power BI Desktop 8月24日发布了更新版本.现将更新内容翻译整理如下,可以根据后面提供的链接下载最新版本使用. 1.主要功能更新 1.1 数据钻取支持在线版 以前的desktop中进行 ... 
- 视频 - 在 VirtualBox 中部署 OpenStack
		大家新年好,CloudMan 今天给大家带来一件新年礼物. 一直以来大家都反馈 OpenStack 学习有两大障碍:1. 实验环境难搭2. 体系复杂,难道大今天我就先帮大家解决环境问题.前两天我抽空在 ... 
- canvas与html5实现视频截图功能
		这段时间一直在研究canvas,突发奇想想做一个可以截屏视频的功能,然后把图片拉去做表情包,哈哈哈哈哈哈~~ 制作方法: 1.在页面中加载视频 在使用canvas制作这个截图功能时,首先必须保证页面上 ... 
- html5 与视频
		1.视频支持格式. 有3种视频格式被浏览器广泛支持:.ogg,.mp4,.webm. Theora+Vorbis=.ogg (Theora:视频编码器,Vorbis:音频编码器) H.264+$$$ ... 
- 基于RN开发的一款视频配音APP(开源)
		在如今React.ng.vue三分天下的格局下,不得不让自己加快学习的脚步.虽然经常会陷入各种迷茫,学得越多会发现不会的东西也被无限放大,不过能用新的技术作出一些小项目小Demo还是会给自己些许自信与 ... 
- 脑洞大开之采用HTML5+SignalR2.0(.Net)实现原生Web视频
		目录 对SignalR不了解的人可以直接移步下面的目录 SignalR系列目录 前言 - -,我又来了,今天废话不多说,我们直接来实现Web视频聊天. 采用的技术如下: HTML5 WebRTC Si ... 
- duang~免费的学习视频来啦:学霸君之全栈测试
		学霸君向童鞋们推荐一款 同名学霸学习 视频教程 重点是完全免费收看学习噢!!! 今天 学霸君推荐腾讯课堂的学霸君之全栈测试 复制下方链接至腾讯课堂中报名学习 https://ke.qq.com/cou ... 
- HTML5笔记2——HTML5音/视频标签详解
		音视频的发展史 早期:<embed>+<object>+文件 问题:不是所有浏览器都支持,而且embed不是标准. 现状:Realplay.window media.Quick ... 
随机推荐
- SQL2008还原数据库无法还原问题
			SQL2008还原备份的SQL2008的.bak文件时会报错,大部分原因是因为当前登录的版本是2005的,因而无法还原用SQL2008备份的数据,结局的办法是去掉登录的服务器名称后面的后缀SQLEXP ... 
- 运用  Swing
			一:Swing的组件: 组件(component,或称原件)就是你会放在GUI上的东西,这些东西用户可以看到并可以与之交互. 组件是可以嵌套的. 创建GUI的四个步骤: 1.创建window(JFra ... 
- flot - jQuery 图表插件(jquery.flot)使用
			Flot是纯Javascript实现的基于jQuery的图表插件,主要支持线状图和柱状图的绘制(通过插件也可以支持饼状图). 特别注意Flot使用的是UTC时间,最好修改flot.js去掉所有的UTC ... 
- django小结
			初始化项目 python manage.py runserver python manage.py runserver 127.0.0.1:8080 python manage.py startapp ... 
- mongodb入门学习小记
			Mongodb 简单入门(个人学习小记) 1.安装并注册成服务:(示例) E:\DevTools\mongodb3.2.6\bin>mongod.exe --bind_ip 127.0.0.1 ... 
- border-radius详解
			语法: border-radius : none | <length>{1,4} [/ <length>{1,4} ]? 取值范围: <length>: 由浮点数字 ... 
- 实时控制软件设计第一周作业-汽车ABS软件系统案例分析
			汽车ABS软件系统案例分析 ABS 通过控制作用于车轮制动分泵上的制动管路压力,使汽车在紧急刹车时车轮不会抱死,这样就能使汽车在紧急制动时仍能保持较好的方向稳定性. ABS系统一般是在普通制动系统基础 ... 
- Redis集群~StackExchange.redis连接Twemproxy代理服务器
			回到目录 本文是Redis集群系列的一篇文章,主要介绍使用StackExchange.Redis进行Twemproxy(文中简称TW)代理服务的连接过程,事务上,对于TW来说,我们需要理解一下它的物理 ... 
- GetLastError()函数返回值及含义
			GetLastError返回的值通过在api函数中调用SetLastError或SetLastErrorEx设置.函数并无必要设置上一次错误信息,所以即使一次GetLastError调用返回的是零值, ... 
- Find linux下
			find 1.作用 find命令的作用是在目录中搜索文件,它的使用权限是所有用户. 2.格式 find [path][options][expression] path指定目录路径,系统从这里开始沿着 ... 
