如何设置背景大小（高度和宽度）？答案

【问题标题】：How to set background size (height & width)?如何设置背景大小（高度和宽度）？
【发布时间】：2013-06-25 13:08:22
【问题描述】：

我对 JavaScript 很陌生。

到目前为止我的代码：

$("#Stage").css(
  "background-image",
  "url(BG.jpg)",
  "background-attachment", 
  "fixed"
);

我想要做的是将背景图像设置为固定大小，因此可以说：width: 100% 和 height: 100%。

【问题讨论】：

标签： javascript jquery css size width

【解决方案1】：

您想使用background-size: 100%。确保其浏览器支持与您支持的平台兼容。

$("#Stage").css({ 
     "background-image": "url(BG.jpg)", 
     "background-attachment": "fixed",
     "background-size": "100%"
});

【讨论】：

谢谢，这行得通，但由于某种原因 "background-size": "100% 100%" 不起作用可能与我正在使用的程序有关 - Edge Animate...任何想法如何获得 100% 的高度和宽度并将图像拉伸到高度和宽度..？
我可能有点晚了，但是对于那些看到这个评论的人来说： background-size: 100% 100%;将图像拉伸到容器的 100% 高度和宽度，而不是图像。因此，如果您希望图像保持其初始尺寸，您需要为宽度或高度设置“自动”，例如背景尺寸：100% 自动；（将图像拉伸到容器的 100% 宽度，并根据初始图像尺寸的比例自动设置高度）。

【解决方案2】：

这对我有用（在滑块内）：

<!-- CSS -->
<style>
    div.img { 
        background-repeat: no-repeat;
        background-position: center center;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
    }
    div.img:nth-of-type(1) {background-image: url('img.jpg');}
    div.img:nth-of-type(2) {background-image: url('img.jpg'); 
    }
</style>

<!-- HTML -->
<div class="img"></div>

【讨论】：

【解决方案3】：

这只是简单的 CSS，而不是 jQuery。你可以在这里阅读更多关于background-size的信息：http://www.w3schools.com/cssref/css3_pr_background-size.asp

【讨论】：