视频作为背景图

最新推荐文章于 2024-01-15 15:49:19 发布

DN_zzz

最新推荐文章于 2024-01-15 15:49:19 发布

阅读量649

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/weixin_43151279/article/details/104016247

版权

我自己的理解就是进入html页面之后，video标签设置成全屏（循环，声音），置为最底层。

<!DOCTYPE HTML>
<html>
<style>
    *{
        margin: 0px;
        padding: 0px;
    }
    video{
        position: fixed;
        right: 0px;
        bottom: 0px;
        min-width: 100%;
        min-height: 100%;
        height: auto;
        width: auto;
        /*加滤镜*/
        /*filter: blur(15px); //背景模糊设置 */
        /*-webkit-filter: grayscale(100%);*/
        /*filter:grayscale(100%); //背景灰度设置*/
        z-index:-11
    }
    source{
        min-width: 100%;
        min-height: 100%;
        height: auto;
        width: auto;
    }
</style>
<body>
<div style="background: #00733e;margin: auto;opacity: 80%;height: 600px;width: 800px">
    sdfasdfasdfsdfad,可以设置各种样式
</div>
<video autoplay loop muted>
    <source src='/js/static/visualResources/instance/storage/assets/media/宣传视频.mp4' type="video/mp4"  />
    Your browser does not support the video tag.
</video>

</body>
</html>

DN_zzz

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
视频作为背景图

<!DOCTYPE HTML><html><style> *{ margin: 0px; padding: 0px; } video{ position: fixed; right: 0px; bottom: 0px; min-width:...
复制链接

扫一扫