如何使用html5的video标签,关于html5 video标签的使用方法

关于html5 video标签的使用方法

发布时间：2020-07-23 16:39:31

来源：亿速云

阅读：92

作者：清晨

小编给大家分享一下关于html5 video标签的使用方法，希望大家阅读完这篇文章后大所收获，下面让我们一起去探讨吧！

一、定义和用法

标签定义视频，比如电影片段或其他视频流。

是html5中的新标签。

二、实例代码

您的浏览器不支持 video 标签。

controls属性告诉浏览器要有基本播放控件。

三、标签熟悉

1、width和height设置视频窗口大小  。

2、preload设置媒体文件预加载情况。

(1)值为auto：让浏览器自动下载整个文件

(2)值为none：让浏览器不必预先下载文件

(3)值为metadata：让浏览器先获取视频文件开头的数据块，从而足以确定一些基本信息。

3、autoplay自动播放。

(1)autoplay属性使浏览器加载完视频文件后立即播放。

controls="controls"  autoplay=“autoplay”>

(2)若启用自动播放，可以将播放器设置为muted状态。这样自动播放时会处于静音状态。用户根据需要点击播放器扬声器图标重新打开声音。

controls="controls"  autoplay=“autoplay”  muted=“muted”>

4、loop循环播放

loop属性让视频播放结束时，再从头开始播放。

5、poster设置替换视频的图片(封面图片)

poster属性可以设置，浏览器在下面三种情况下会使用这个图片：

(1)视频第一帧未加载完毕

(2)把preload属性设置为none

(3)没有找到指定的视频文件

controls="controls"  poster="替换图片">

看完了这篇文章，相信你对关于html5 video标签的使用方法有了一定的了解，想了解更多相关知识，欢迎关注亿速云行业资讯频道，感谢各位的阅读！