html5的video全屏作为背景的方法

作者: 孟烦了的爱豆 | 来源:发表于2018-01-18 15:04 被阅读18次

直接用css来实现代码如下：

  <style type="text/css">  
        *{  
            margin: 0px;  
            padding: 0px;  
        }  
        video{  
            position: fixed;  
            right: 0px;  
            bottom: 0px;  
            min-width: 100%;  
            min-height: 100%;  
            height: auto;  
            width: auto;  
            /*加滤镜*/  
            /*-webkit-filter: grayscale(100%);*/  
            /*filter:grayscale(100%);*/  
        }  
        source{  
            min-width: 100%;  
            min-height: 100%;  
            height: auto;  
            width: auto;  
        }  
    </style>  
</head>  
<body>  
//资源格式自己进行添加  
 <video autoplay="autoplay" loop="loop">  
    <source  src="video/ting.mp4" type="video/mp4" >;  
</video>