HTML视频标签

本文概述

  • HTML视频标签示例
  • 支持的浏览器
  • HTML视频标记的属性
  • HTML视频标签属性示例
  • HTML视频格式的MIME类型
HTML 5也支持< video> 标记。 HTML视频标签用于在网页上流传输视频文件, 例如电影剪辑, 歌曲剪辑。
当前, HTML视频标签支持三种视频格式:
  1. mp4
  2. 网络
  3. 奥格
【HTML视频标签】让我们看一下定义哪个Web浏览器支持视频文件格式的表。
浏览器 mp4 网络 奥格
IE浏览器 yes no no
谷歌浏览器 yes yes yes
火狐浏览器 yes yes yes
Opera no yes yes
苹果Safari yes no no
Android还支持mp4格式。HTML视频标签示例让我们看看使用HTML video标签播放mp4文件的代码。
< video controls> < source src="http://www.srcmini.com/movie.mp4" type="video/mp4"> Your browser does not support the html video tag. < /video>

立即测试
让我们看一下使用HTML视频标签播放ogg文件的示例。
< video controls> < source src="http://www.srcmini.com/movie.ogg" type="video/ogg"> Your browser does not support the html video tag. < /video>

支持的浏览器
Element Chrome IE Firefox Opera Safari
< video> Yes Yes Yes Yes Yes
HTML视频标记的属性让我们看一下HTML 5视频标记属性的列表。
属性 描述
controls 它定义了用播放/暂停按钮显示的视频控件。
height 用于设置视频播放器的高度。
width 用于设置视频播放器的宽度。
poster 它指定当不播放视频时在屏幕上显示的图像。
autoplay 它指定视频将在准备就绪后立即开始播放。
loop 它指定视频文件每次完成时都将重新开始。
muted 它用于使视频输出静音。
preload 当页面加载时, 它指定作者视图以上传视频文件。
src 它指定视频文件的源URL。
HTML视频标签属性示例让我们看一下使用高度, 宽度, 自动播放, 控件和循环属性的HTML视频标记示例。
< video width="320" height="240" controls autoplay loop> < source src="http://www.srcmini.com/movie.mp4" type="video/mp4"> Your browser does not support the html video tag. < /video>

立即测试
HTML视频格式的MIME类型可用的MIME类型HTML视频标签如下所示。
影片格式 MIME类型
mp4 video/mp4
ogg video/ogg
webM video/webM

    推荐阅读