Html 使用视频作为背景

我想知道哪一种是使用视频作为背景的好方法，例如在Square Cash中使用：

您的浏览器不支持视频标记。我建议你升级你的浏览器。
#视频容器{
最高：0%；
左：0%；
身高：100%；
宽度：100%；
溢出：隐藏；
位置：绝对位置；
}
录像带{
位置：绝对位置；
z指数：0；
宽度：100%；
}

添加了

对象匹配：覆盖视频的行为方式类似于
背景尺寸：封面


*{
框大小：边框框；
}
身体{
保证金：0；
填充：0；
}
.videobg{
高度：100vh；
溢出：隐藏；
填充：5vh；
位置：相对；/*需要正确定位视频*/
}
录像带{
位置：绝对位置；
排名：0；
左：0；
宽度：100%；
身高：100%；
z指数：-1；
对象适合度：cover；/*与“绝对”结合使用，与背景大小类似，但适用于DOM元素*/
}

使用CSS将元素放在它前面。谢谢，但我想知道如何插入视频作为背景。你不能。相反，你需要在视频前添加元素。谢谢。这是一个非常有用的好答案，我也面临着同样的问题。你能附上任何生动的或JSFIDLE的例子来更清楚地说明问题吗。谢谢，一把小提琴就好了。在背景中播放视频有理想的重量吗？100Mb太多了？不，没有最佳性能，您可以在画布中绘制视频，并使用jquery调整画布大小
<div id="video-container">
<video autoplay loop poster="http://media.w3.org/2010/05/sintel/poster.png" muted="muted">
                    <source id="mp4" src="http://media.w3.org/2010/05/sintel/trailer.mp4" type="video/mp4">
                    <source id="webm" src="http://media.w3.org/2010/05/sintel/trailer.webm" type="video/webm">
                    <source id="ogv" src="http://media.w3.org/2010/05/sintel/trailer.ogv" type="video/ogg">
                    Your browser does not support the video tag. I suggest you upgrade your browser.
                </video>
</div><!-- end video-container -->




#video-container {
    top:0%;
    left:0%;
    height:100%;
    width:100%;
    overflow: hidden;
        position: absolute;
}
video {
    position:absolute;
    z-index:0;
        width: 100%;
}