当前，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 文件

<!DOCTYPE HTML>

<html>

<body>

<video width="320" height="240" controls="controls">

  <source src="/i/movie.ogg" type="video/ogg">

  <source src="/i/movie.mp4" type="video/mp4">

Your browser does not support the video tag.

</video>

</body>

</html>

<video> 标签的属性

属性 值 描述
autoplay autoplay 如果出现该属性，则视频在就绪后马上播放。
controls controls 如果出现该属性，则向用户显示控件，比如播放按钮。
height pixels 设置视频播放器的高度。
loop loop 如果出现该属性，则当媒介文件完成播放后再次开始播放。
preload preload

如果出现该属性，则视频在页面加载时进行加载，并预备播放。

如果使用 "autoplay"，则忽略该属性。
src url 要播放的视频的 URL。
width pixels 设置视频播放器的宽度。

【HTML5】video视频的更多相关文章

  1. HTML5 Video(视频)

    HTML5 Video(视频) 很多站点都会使用到视频. HTML5 提供了展示视频的标准. 检测您的浏览器是否支持 HTML5 视频: 检测 Web站点上的视频 直到现在,仍然不存在一项旨在网页上显 ...

  2. HTML5: HTML5 Video(视频)

    ylbtech-HTML5: HTML5 Video(视频) 1.返回顶部 1. HTML5 Video(视频) 很多站点都会使用到视频. HTML5 提供了展示视频的标准. 检测您的浏览器是否支持 ...

  3. 【转】Android HTML5 Video视频标签自动播放与自动全屏问题解决

    为了解决 HTML5Video视频标签自动播放与全屏问题,在网上找了很多相关资料,网上也很多关于此问题解决方法,但几乎都不能解决问题,特别对各大视频网站传回来的html5网页视频自动播放与全屏问题,我 ...

  4. HTML5 video 视频标签 常用属性

    最近在做手机端的 h5 页面的视频直播功能,用到了 Video 标签.其常用的属性有以下几个: src.poster.preload.autoplay.loop.controls.width.heig ...

  5. 让所有浏览器支持HTML5 video视频标签

    HTML5究竟需要多少种视频编码格式 当前,video 元素支持三种视频格式:Ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件MPEG4 = 带有 H.264 视频编 ...

  6. HTML5 video 视频标签全属性详解

    现在如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Theora或者VP8(如果这玩意儿没出事的话)的(Opera.Mozilla.Chrome),支持H.264的(Safari.IE ...

  7. HTML5 video视频字幕的使用和制作

    一.video支持视频格式: 以下是三种最常用的格式 1. ogg格式:带有Theora视频编码(免费)+Vorbis音频编码的Ogg文件(免费) 支持的浏览器:firefox.chrome.oper ...

  8. HTML5 video标签播放视频下载原理

    HTML5 video https://github.com/remy/html5demos/blob/master/demos/video.html <video preload=" ...

  9. html5 video标签屏蔽右键视频另存为的js代码-HTML5教程

    点评:html5 video标签本身有下载功能但是在video区域内,点击右键可以将“视频另存为”下面是屏蔽右键视频另存为的js代码,有此需求的朋友不要错过   做HTML5的video标签,本身我们 ...

  10. HTML5 学习07——Video(视频)Audio(音频)

    <video> 元素:提供了 播放.暂停和音量控件来控制视频. width 和 height 属性:控制视频的尺寸 <video> 与</video> 标签之间插入 ...

随机推荐

  1. ++X 与 X++ 的区别

    <?php $x=10; echo ++$x; // 输出 11 $y=10; echo $y++; // 输出 10 $z=5; echo --$z; // 输出 4 $i=5; echo $ ...

  2. Swift Tour 随笔总结 (2)

    Type Aliases typealias AudioSample = UInt16 Booleans 非boolean值不会被替代为bool,例如: let i = 1 if i { // thi ...

  3. jvm内存模型和内存分配

    1.什么是jvm? (1)jvm是一种用于计算设备的规范,它是一个虚构出来的机器,是通过在实际的计算机上仿真模拟各种功能实现的. (2)jvm包含一套字节码指令集,一组寄存器,一个栈,一个垃圾回收堆和 ...

  4. 在C/C++程序里打印调用栈信息

    我们知道,GDB的backtrace命令可以查看堆栈信息.但很多时候,GDB根本用不上.比如说,在线上环境中可能没有GDB,即使有,也不太可能让我们直接在上面调试.如果能让程序自己输出调用栈,那是最好 ...

  5. 极客教学：如何使用树莓派击落&劫持无人机

    本教程的目的是帮助大家理解如何研究未受保护的无线通信的安全风险所在,同时我们希望大家不要对技术进行滥用.我们这里采用的例子是一个流行的无人机模型:Parrot AR.Drone 2.0. 四轴无人机能 ...

  6. Apache VirtualHost配置

    转载:http://www.cnblogs.com/wpjsolo/archive/2012/01/19/2327457.html 以lampp环境为例子,其他环境只是配置文件的路径不同. 先要在   ...

  7. C/C++ 文件操作

    C/C++ 文件操作大概有以下几种 1.C的文件操作: 2.C++的文件操作: 3.WINAPI的文件操作: 4.BCB库的文件操作: 5.特殊文件的操作. 当然了,水题时最常用的当然还是: freo ...

  8. win7/ubuntu双系统下，如何恢复成win7引导及卸载ubuntu

    电脑原来是win7系统,后来通过硬盘安装了Ubuntu,同时把Ubuntu设置成了开机引导项(开机时选择操作系统的界面成了紫色背景白色字体的界面),ubuntu引导开机的缺点是将来要卸载Ubuntu时 ...

  9. python中import和from...import...的区别

    python中import和from...import...的区别: 只用import时,如import xx,引入的xx是模块名,而不是模块内具体的类.函数.变量等成员,使用该模块的成员时需写成xx ...

  10. 黑客逃避追踪，为什么要用虚拟机 + TOR + VPN 呢？

    为啥要使用虚拟机 使用虚拟机主要有俩原因. 第一个是为了好收拾,清理痕迹什么的.特别是MAC地址,系统指纹信息等等,这些一旦被收集到都可以作为呈堂证供.用虚拟机,干了坏事把快照恢复一下就好,省的清理c ...