html5 css3 背景视频循环播放代码

最新推荐文章于 2025-07-31 13:55:22 发布

转载最新推荐文章于 2025-07-31 13:55:22 发布 · 2.4k 阅读

1 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/pcyy/p/10953552.html

文章标签：

#前端 #ViewUI

此博客为转载内容，转载自https://www.cnblogs.com/pcyy/p/10953552.html ，涉及前端领域。

<div style ="position: absolute; z-index: -1; top: 0px; left: 0px; bottom: 0px; right: 0px; overflow: hidden; background-size: cover; background-color: transparent; background-repeat: no-repeat; background-position: 50% 50%; background-image: none;">
    <video style="margin: auto; position: absolute; z-index: -1; top: 50%; left: 50%; transform: translate(-50%, -50%); visibility: visible; opacity: 1; width: 100%; height: auto;" autoplay="autoplay" loop="loop" poster="{{media url="wysiwyg/landding-carburetor/head-bgi.png"}}" muted="">
        <source src="{{view url=videos/test-video.mp4}}" type="video/mp4" />
    </video>
</div>

转载于:https://www.cnblogs.com/pcyy/p/10953552.html