HTML5视频

视频格式

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

工作

controls 属性供添加播放、暂停和音量控件。

包含宽度和高度属性也是不错的主意。

<video> 与 </video> 之间插入的内容是供不支持 video 元素的浏览器显示的:

<video src = "movie.gg" width = "320" height = "240" controls = "control“>
</video>

video 元素允许多个 source 元素。source 元素可以链接不同的视频文件。浏览器将使用第一个可识别的格式

<video width="320" height="240" controls="controls">
  <source src="movie.ogg" type="video/ogg">
  <source src="movie.mp4" type="video/mp4">
</video>

<video>标签属性

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

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

如果使用 "autoplay",则忽略该属性。

|
| src | url | 要播放的视频的 URL。 |
| width | pixels | 设置视频播放器的宽度。 |

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 视频处理 HTML5中的视频,使用video和source搭配,来解决浏览器视频格式兼容问题,如果都不支持,可以在...
    不住海边也喜欢浪阅读 5,114评论 2 15
  • 属性解析: 当前,video 元素支持三种视频格式:格式 IE Firefox Opera Chr...
    任振铭阅读 1,454评论 0 0
  • @(HTML5)[HTML5视频与音频] [TOC] 十二、HTML5视频与音频 简单介绍HTML5 对视频和音频...
    踏浪free阅读 3,952评论 0 0
  • HTML 5 HTML5概述 因特网上的信息是以网页的形式展示给用户的,因此网页是网络信息传递的载体。网页文件是用...
    阿啊阿吖丁阅读 9,872评论 0 0
  • 护城河边最近又把围栏加高了一次,这次加高估计大人翻过去都得费点劲。 水城位于长江边上,城中有几条支流穿城而过,水缓...
    困囿阅读 1,846评论 0 0

友情链接更多精彩内容