Web速查-索引

video

定义

<video> 标签定义视频,比如电影片段或其他视频流。

属性

属性 说明
autoplay autoplay 如果指定该属性,则视频在就绪后将自动播放。
controls controls 如果指定该属性,则向用户显示控件,比如播放/暂停按钮。
height pixels 指定视频播放器的高度。
loop loop 如果指定该属性,将循环播放视频。
muted muted 如果指定该属性,则将视频的音频输出为静音。
poster URL 指定视频正在下载时显示的图像。
preload auto、metadata、none 指定视频在页面加载时,是否进行预加载。注意:如果同时指定了 autoplay 属性,则忽略该属性。
auto:要求浏览器尽快加载整个视频,默认行为
metadata:只加载视频的元数据(宽度、高度、第一帧影像和视频总长度等)
none:在用户点击开始播放之前不会加载视频
src URL 指定要播放的视频文件的 URL 地址。
width pixels 指定视频播放器的宽度。

支持格式说明

目前,<video> 元素支持三种视频格式:MP4、WebM、Ogg。

浏览器 MP4 WebM Ogg
Internet Explorer 支持 不支持 不支持
Chrome 支持 支持 支持
Firefox 支持(Windows在第21版之后;Linux在第30版之后) 支持 支持
Safari 支持 不支持 不支持
Opera 支持(在第25版之后) 支持 支持

MP4 = MPEG 4文件使用 H264 视频编解码器和 AAC 音频编解码器。

WebM = WebM 文件使用 VP8 视频编解码器和 Vorbis 音频编解码器。

Ogg = Ogg 文件使用 Theora 视频编解码器和 Vorbis 音频编解码器。

实例

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>NTHOME-零基础入门学习Web(HTML5+CSS3)</title>
</head>
<body>
<video width="640" height="360" controls>
<source src="video/1.mp4" type="video/mp4">
您的浏览器不支持 HTML5 video 标签。
</video>
</body>
</html>

浏览器支持

表格中的数字表示支持该属性的第一个浏览器版本号

Safari Chrome FireFox IE
5.0 5.0 4.0 9.0