使用HTML和CSS将.MP4视频作为背景

我真的很想知道怎么做。我的站点是用Ruby on Rails创建的，但我假设要做到这一点，您只需要使用HTML和CSS。

以下是我到目前为止所做的尝试：

视图主体/layouts/home\u layout.html.erb:

`

`

---

我的视频文件位于资产/images/trafficLoop.mp4

最好使用的是YTPlayer

将您的视频上传到Youtube，然后使用player，这是全屏背景播放器在web上最常见也是最好的解决方案。它还与所有版本的浏览器兼容

像这样使用它

$(function(){
      $(".player").YTPlayer();
    });

#homeVideo {
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

#homeVideo video {
    position: absolute;
    left: 50%;
    top: 50%;
    min-width: 100%;
    min-height: 100%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    z-index: 0;
}

#homeVideo div {
    position: relative;
    z-index: 1;
}

$(function(){
      $(".player").YTPlayer();
    });