html5 video标签制作背景图

阅读: 评论:0

html5 video标签制作背景图

html5 video标签制作背景图

代码:

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title>
</head>
<style>* {margin: 0px;padding: 0px;}video {position: fixed;right: 0px;bottom: 0px;max-width: 100%;min-height: 100%;height: auto;width: auto;}
</style><body><video muted autoplay="autoplay" loop="loop"><source src="../1.mov"></video>
</body></html>

效果:

浏览器兼容性:
适用所有主流浏览器
ps:
muted 属性为了在chorme可以自动播放视频
autoplay 视屏自动播放
loop 视频循环播放

本文发布于:2024-02-01 06:34:02,感谢您对本站的认可!

本文链接:https://www.4u4v.net/it/170674044234583.html

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。

标签:背景图   标签   video
留言与评论(共有 0 条评论)
   
验证码:

Copyright ©2019-2022 Comsenz Inc.Powered by ©

网站地图1 网站地图2 网站地图3 网站地图4 网站地图5 网站地图6 网站地图7 网站地图8 网站地图9 网站地图10 网站地图11 网站地图12 网站地图13 网站地图14 网站地图15 网站地图16 网站地图17 网站地图18 网站地图19 网站地图20 网站地图21 网站地图22/a> 网站地图23