Css 跨屏幕分辨率调整图像大小

我有一个div标签，比如

<div id="MainMenu1" dojotype="dijit.layout.ContentPane"></div>

我看到背景图像在较小的屏幕上很好，但在较宽的屏幕上，它只占据中心位置。我希望即使在更宽的屏幕上，图像也能占据整个屏幕，我不希望图像“重复”。

---

我该怎么做呢？

您可以让图像重复，这意味着它覆盖了整个空间，也可以使用

背景大小：cover

，它将缩放图像以覆盖整个区域，同时保持图像的原始纵横比

#MainMenu1 
{
height:53px;
margin:auto;
width:100%;
border:0;
background: url(../images/top_banner.png) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

---

试试这个。它对我非常有效。它应该完美地将背景放在中间，并合理地将其拉伸到网站正在浏览的任何屏幕大小。

如果你选择背景位置，会发生什么：中心；离开CSS？@Chin图像与左边对齐，如果我去掉中心。这在mozilla中有效。但我想加入IE8。忘记在问题中指定了。那么使用更大的图像？我不知道在IE9之前有什么方法可以做到这一点而不重复。

#MainMenu1 
{
height:53px;
margin:auto;
width:100%;
border:0;
background: url(../images/top_banner.png) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}