用于在后台登录页使用视频背景,也可定义登录页背景颜色或背景图片。
- 视频背景文件可以到 https://coverr.co/ 去下载或直接引用coverr在线的视频文件地址(速度较慢)
- 建议将视频文件的第一帧作为背景,这样不会造成视觉误差。
- 建议将下载的视频传到第三方空间,再进行引用。
代码
<div id="video_wrapper">
<video autoplay="" muted="" loop="">
<source src="https://t1.aixinxi.net/o_1cnh2rofs19skpcq11u6g921qm9a.mp4" type="video/mp4">
</video>
</div>
body {
background:url("https://wx2.sinaimg.cn/large/0060lm7Tly1fvblyjxs3dj31hc0u0tc1.jpg");
background-size:cover;
}
#video_wrapper {
margin: 0px;
padding: 0px;
}
#video_wrapper video {
position: fixed;
top: 50%;
left: 50%;
z-index: -100;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
transform: translate(-50%, -50%);
}