Javascript 如何将内容背景图像拉伸到全屏？

我有这个HTML。以下是：

<div class="item">
  <div class="bg_img"></div>
  <h1>morning</h1>
  <h2>today</h2>
  <p>lorem ipsum.</p>
</div>

这个结构工作正常。但我想把这些背景图像附加到身体和全屏尺寸上。如何通过JavaScript或纯jQuery（无插件）实现这一点？

使用此CSS：

background-size: cover;

尝试下面的代码

 #container .item .bg_img{
   background: url('/img/mainpage/demo.jpg') no-repeat center center fixed; 
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
 }

---

就连我也在为同样的问题苦苦挣扎，最后我找到了一个解决办法

    body //your container name
    {
        background-image: url(Images/caramel%20gradient%20for%20website.png);
        background-size: 100%;
    }

---

你是指与身体上下文相关而不是与物品相关的图像吗

您可以使用position:fixed。顶部、左侧、底部和右侧将确保占据整个页面

背景尺寸：封面将确保图像本身覆盖页面。根据您使用的图像，您可能需要另一种解决方案。例如：你可以将图像居中，然后淡入背景色（但这取决于你自己）

使用-1的z索引以确保它不会模糊您的内容

item .bg_img {
    background:url('http://www.ninahale.com/wp-content/uploads/2013/08/Post-Enhanced-Campaigns-World.jpg') fixed center center;
    background-size: cover;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
}

---

小提琴：

你能创建一把小提琴并链接到这里吗？。该页面上也有jQuery版本背景尺寸：此项目类别中仅覆盖全屏。但我希望所有屏幕都是完整图像。将#容器的宽度和高度设置为100%，效果非常好！非常感谢。背景尺寸：此项目类别中仅覆盖全屏。但我想所有的屏幕都满了image@DokuzTaneOn尝试背景大小：100%100%；背景尺寸：此项目类别中仅覆盖全屏。但我希望所有的屏幕都是完整的图像，我会给你的。你的意思是你有一个图像，必须拉伸到窗口大小。

item .bg_img {
    background:url('http://www.ninahale.com/wp-content/uploads/2013/08/Post-Enhanced-Campaigns-World.jpg') fixed center center;
    background-size: cover;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
}