CSS：100％的宽度和背景？ [英] CSS: 100% width and background?

问题描述

在我的网页有2-3段有100％的宽度和背景。当我打开全屏幕上一切正常，但是当屏幕小于960像素的背景图像（在本节内容的宽度）不是整个页面。右侧WHIS隐藏在firtst一刻没有背景 - 它是白色的。你可以看到我的意思是： http://micobg.net/10th/

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/

推荐答案

的背景大小只需添加：你申请，其中100％风格元素背景图像。在Firefox，Safari和Opera。例如：

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>

这篇关于CSS：100％的宽度和背景？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！