Question

我对网络开发还很陌生，我试图将特定“div”的背景设置为视频。经过广泛的研究，我成功地做到了，但问题是视频没有覆盖整个页面。有没有办法让视频覆盖整个页面的宽度，只是为了特定的'div'部分......？谢谢！：）

以下是我用于在后台插入视频的HTML代码...

 <header>

        <div style="position: fixed; top: 0; width: 100%; height: 100%; z-index: -1;background-size: cover; background-image:url(frame.jpg) no-repeat center top">
                <video id="video" style="width:100%; height:100%" autoplay loop>
                  <source id="mp4" src="Sea.mp4" type="video/mp4">
                </video>
        </div>

Answer 1

您未正确应用background-image属性值：

background-image仅接受url("")（在您的情况下），但不接受position和size。

喜欢：

background: url(frame.jpg) center top / cover;

<强> jsBin demo

还要添加

body{margin:0;}

删除应用于body

的默认保证金

视频设置为div背景，不覆盖页面的整个宽度

1 个答案: