HTML规定了一种通过video元素来包含视频的标准方法

一段HTML5视频不可缺少的元素有video、controls等。。

直到现在,仍然不存在一项在网页上显示视频的标准、

大多数视频是通过flash、登插件来显示的。然而并非所有浏览器都拥有相同的插件、

video是HTML的标签定义视频,比如电影片段或其他视频流,controls用来显示视频的一个控制。

<body>
<video src="视频地址.ogg" width="400px" height="300px" controls="controls"></video>
</body>

属性:      值:    描述:

autoplay          autoplay            如出现该属性,视频在就绪后会马上播放

controls     controls     如出现该属性,则向用户显示控件,比如播放按钮.音量.全屏

loop       loop       如出现该属性,当媒体文件完成播放后会再次进行播放

muted      muted     该属性规定音频输出为静音

poster      url                   视频下载时显示图像,或者在用户点击播放按钮前显示图像

src                  url                   播放视频的url.

width                                       自定义设置视频的宽度

height                              自定义设置视频的高度

preload    preload      如出现该属性,则视频在页面加载时进行加载,并预备播放,如使用“controls”则忽略该属性

当前,video元素支持三种视频格式:

1)ogg=带有theora视频编码和vorbis音频编码的ogg文件

2)mpeg4=带有h.264视频编码和aac音频编码的mpeg4文件

3)webm=带有vp8视频编码和Vorbis音频编码的webm文件

html5 视频的更多相关文章

  1. HTML5视频Video 音频Audio

    视频协议 视频格式 Flash HTML5 HTTP flv HTTP f4v HTTP mp4 HTTP m3u8 HTTP webm HTTP ogg RTMP flv RTMP f4v RTMP ...

  2. [转] Android 4.4中播放HTML5视频<video>的Bug

    近期Nexus 4手机自动升级到Android4.4,本来挺好的一件事儿,结果发现自己的应用中出现一个Bug,应用中使用了Webview播放HTML5视频,代码如下: <video width= ...

  3. html5视频全频播放

    html5视频全频播放 旋转90度 对video进行缩放 修正position 效果还凑合 代码 $(media).rotate({ // angle: 90, duration: 100, anim ...

  4. HTML5视频标签video

    现阶段,我们要在网页中嵌入视频的最可靠最常用的办法是使用Flash,通过使用<object>和<embed>标签,就可以通过浏览器播放swf,flv等格式视频文件,但是前提是浏 ...

  5. HTML5 视频规范简介

    HTML5 视频规范简介  创建于 2013-02-03, 周日 00:56  作者 白建鹏 HTML 一词是“超文本标记语言”(Hyper-Text Markup Language)的缩写,是用于描 ...

  6. 使用jQuery播放/暂停 HTML5视频

    文章来自:http://blog.okbase.net/jquery2000/archive/4485.html 我尝试用jQuery控制HTML5视频,两个视频分别在两个tab中,我希望点中tab后 ...

  7. 怎样获取HTML5视频的持续时间

    HTML5视频的Bigger体验是非常令人振奋的,非常easy的道理,不用载入和依赖烦人的Flash或其它第三方插件来播放视频,也是大功一件.我们能够通过自己定义控件对视频进行显示和操控,当中一个常见 ...

  8. 使用 video.js 开发 HTML5 视频页面

    时间 2015-05-13 17:11:58 The GIS Guy 原文  http://thegisguy.tk/html5-video-using-video-js/ 主题 Video.js H ...

  9. 使用HTML5视频事件示例

    <!DOCTYPE html > <html > <head> <title>Video events example</title> &l ...

随机推荐

  1. 再说重写IHttpHandler,实现前后端分离

    aspx页面第一次加载时,HttpHandler 里面是如何编译指定页面的呢?Framework提供了编译页面的API如下: BuildManager.CreateInstanceFromVirtua ...

  2. 定义了重复的system.web.extensions/scripting/scriptResourceHandler怎么办

    今天移转系统,都配置好之后,系统报错说我的web服务下的web.config 定义了重复的 system.web.extensions/scripting/scriptResourceHandler ...

  3. HTML与JS

    网页显示过程中的处理流程: 分析HTML 构造DOM树 载入外部JS文件及CSS文件 载入图像文件等外部资源 JS在分析后开始运行 全部完成 JS的表述方式及其执行流程: <script> ...

  4. 在Wince模拟器接入网络的方法

    我第一次使用wince调用WCF服务的时候总是报错,找了半原因发现程序部署在模拟器中,而模拟器没有连接到网络,所以无法连接到WCF服务器. 以下是wince接入网络的方法:        1.点击模拟 ...

  5. JVM性能调优博客

    http://houjixin.blog.163.com/blog/static/35628410201411275719843/ http://blog.csdn.net/lastsweetop/a ...

  6. hdu 3339 In Action

    http://acm.hdu.edu.cn/showproblem.php?pid=3339 这道题就是dijkstra+01背包,先求一遍最短路,再用01背包求. #include <cstd ...

  7. 《Programming WPF》翻译 第8章 6.我们进行到哪里了?

    原文:<Programming WPF>翻译 第8章 6.我们进行到哪里了? 动画可以增强应用程序的交互感.它有利于更平滑的转换--当条目出现或消失的时候.它应该,当然,被用于体验和重新着 ...

  8. 微信授权登陆接入第三方App(步骤总结)Android

    微信授权登陆接入第三方App(步骤总结)Android Android App实现第三方微信登录

  9. 完整的多项匹配tomcat access日志的正则

    <pre name="code" class="html"><pre name="code" class="ht ...

  10. spring 4 泛型注入

    最近对系统进行改造,发现在泛型实例初始化的时候,得不到想要的泛型.或者需要强制转换. spring 4 开始支持泛型对象初始化,初始化方法如下: 注:使用配置文件的方法暂时还没有发现,下面是使用jav ...