HTML5video视频标签全属性详解

controls

controls属性是一个布尔属性。可以有,也可以没有。如果有这个属性,浏览器就会为视频显示增加内置的控件。不同浏览器提供的控件有所不同,所以要查看浏览器,看看会有哪些控件。这是Safair上提供的控件。

autoplay

autoplay布尔属性告诉浏览器:一旦有了足够的数据就开始播放视频。你可能会看到,视频几乎立即开始播放

src

src属性与<img>元素的src很类似,这是一个URL,告诉video元素在哪里查找源文件。

preload

属性preload通常用于细粒度地控制视频如何加载,来实现优化,大多数情况下,浏览器会根据是否设置autoplay以及用户的带宽来选择加载多少视频。可以覆盖这种设置,将preload设置为“none”(在用户真正“播放”视频之前不下载视频),也可以设置为“metadata”(下载视频元数据,但不下载视频内容),或者可以设置为“auto”让浏览器来做决定。

poster

浏览器通常会把视频的一帧显示为“海报”图像,来表示这个视频。如果你删除了autoplay属性,单机播放之前就会看到这个图像。要由浏览器来选择显示哪一帧。通常,浏览器会显示视频的第一帧……这往往是一个黑屏。如果你想显示某个特定的图像,要由你来创建想显示的图像,并使用poster属性来指定

width,height

width和height属性会设置视频显示区(也称为“视窗”)的宽度和高度。如果指定了一个海报(poster),海报图象会缩放到你指定的宽度和高度。视频也会缩放,不过会保持其宽高比(例如,4:3或16:9),所以,如果两边或者上下边有多余的空间,视频会采用上下加黑边(letter-boxed)或左右加黑边(pillar-boxed)的模式来适应显示区大小。如果你想得到最佳的性能,就应该尽量采用视频原本的尺寸(这样的浏览器就不用实时缩放视频了)。

loop

这也是一个布尔属性,如果有loop属性,视频结束播放之后会自动重新开始播放视频。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值