Vue使用视频作为背景

1、代码：

 <div class="videoContainer">
      <video class="fullscreenVideo" id="bgVid" playsinline="" autoplay="" muted="" loop="">
        <source src="../assets/video/login.mp4" type="video/mp4">
      </video>
  </div>

贴到最下面</div></template> 里面

2、Css样式：

.videoContainer{
  position: fixed;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: -100;
}

.videoContainer:before{
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  z-index: -1;
  top: 0;
  left: 0;
  background: rgba(25,29,34,.65);
  background-size: cover;
}

.fullscreenVideo{
  width: 100%;
  height: 100%;
  object-fit: fill
}

注意：这个样式让视频处于最底层，如果有背景图片要删除以前的背景图否则视频会被遮挡