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 ...
随机推荐
- 关于iOS热修复(HotPatch)技术的使用总结
苹果做了非常多的努力来建造和维持一个健康并且干净的应用环境.其中对现在的现状起到很大作用的部分就是苹果APP STORE,它是被一个十分周密的对所有提交的应用进行检查的审批程序所保护的.尽管这个程序是 ...
- 关于(object sender, EventArgs e)
sender是事件源 就是指发起这个事件的对象(控件)//表示触发事件的那个控件比如说你按下按钮,那么sender就是按钮 又如:textboxchange,sender就是该textbox,在事 ...
- Glide 魔法般的自定义扩展
使用过Glide的朋友都明白,简单的用法就是: Glide.with(context) .load("http://inthecheesefactory.com/uploads/source ...
- 数据库连接池:Druid
转自: http://www.cnblogs.com/windlaughing/p/3287501.html Java连接数据库方法概述 java.sql提供了一些接口和类,用于支持数据库增删改查等相 ...
- Linux下browser-sync无法启动Chrome的解决方法
笔者的环境: OS: Ubuntu Linux Browser: Chrome, Firefox 每次希望启动chrome浏览器,系统都会报错: browser-sync start -s --dir ...
- 【leedcode】add-two-numbers
You are given two linked lists representing two non-negative numbers. The digits are stored in rever ...
- matlab备忘录
1.使用运算符‘:’将矩阵的所有列拼成一列 2..'与'操作差别在复数运算时,'是复共轭转置,.'是转置 3.读取文件夹下的某类型文件 img_dir = dir('*.tif'); img_dir ...
- trunk 的坑
三层交换机A和三层交换机B之间原本配置有trunk口,如再用trunk连二层交换机会导致环路,网络不通.将L3 A和L3-B之间断开正常.
- 设计一个程序,程序中有三个类,Triangle,Lader,Circle。
//此程序写出三个类,triangle,lader,circle:其中triangle类具有类型为double的a,b,c边以及周长,面积属性, //具有周长,面积以及修改三边的功能,还有判断能否构成 ...
- 用c的数组简单的模拟了入栈
其实很简单,只要控制住输出时倒输出.且只输出一个 #include <stdio.h>#include <stdlib.h>int zhan[20];int n=-1;void ...