CSS: 100% width and background?

问题

In my page have 2-3 sections that have 100% width and background. When I open it on full screen everything is ok but when the screen is smaller than 960px (width of content in this sections) background image is not the entire page. The right side whis is hidden in firtst moment haven't background - it's white. You can see what I mean here: http://micobg.net/10th/

回答1:

Simply add the background-size:100% style to the element where you applied background-image. Works in Firefox, Safari, and Opera. For example:

<style>
.divWithBgImage {
  width: 100%;
  height: 600px;
  background-image: url(image.jpg);
  background-repeat: no-repeat;
  background-size: 100%; //propotional resize
/*
  background-size: 100% 100%; //stretch resize
*/
}
</style>
<div class="divWithBgImage">
  some contents
</div>

回答2:

Regarding to this article, you should to use cover as well:

html { 
  background: url(PATH_TO_IMAGE) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

回答3:

Use background min-width:960px; instead of width:100%; Cheers

来源：https://stackoverflow.com/questions/12085881/css-100-width-and-background