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

【问题标题】：Video set as div background, does not cover full width of the page视频设置为 div 背景，不覆盖页面的整个宽度
【发布时间】：2015-05-18 02:12:25
【问题描述】：

我对网络开发相当陌生，我试图将特定“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>

【问题讨论】：

全宽是指视频两侧仍有白色边缘。我尝试降低 z-index 值，移除背景颜色（css），但所有这些都不起作用......

标签： html video width

【解决方案1】：

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

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

喜欢：

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

jsBin demo

还要加

body{margin:0;}

删除应用于body的默认边距

【讨论】：

嗨！我已经在页眉中插入了这个，所以我尝试将页眉的边距设置为 0，但它似乎不起作用......
您知道body 标签，对吧？如果body 不起作用，请尝试使用*{margin:0;}
是的。我现在用body标签尝试了演示中所做的事情，但是侧面仍然有空格.. body { overflow-x: hidden;边距：0； }
@Shashank 啊，我知道你在设置背景图片时遇到了问题。我会在几秒钟内编辑我的答案。
您好，感谢您的建议，但似乎没有用。图像，只是视频的第一帧。无论图像是否存在，视频不应该覆盖宽度吗？