CSS：100％的宽度和背景？

在我的页面中有2-3个宽度和背景为100％的部分。当我全屏打开时，一切正常，但当屏幕小于960像素（本节内容的宽度）时，背景图像不是整个页面。右边的whis在隐藏的最美好的时刻没有背景 - 它是白色的。你可以在这里看到我的意思：http://micobg.net/10th/CSS：100％的宽度和背景？

来源

2012-08-23 micobg

阅读：http://www.whatstyle.net/articles/48/css_tricks_1_100_percent_width_in_a_variable_width_container – diEcho

你可以找到有用的信息[stackoverflow.com/questions/2083831/css-background-image-does-not-fill-when-scrolling](http://stackoverflow.com/questions/2083831/css-background-image-does-不滚动时填充） – utsikko

Use background min-width：960px;而不是宽度：100％; 干杯

来源

2012-08-23 14:08:59

只需将background-size:100%样式添加到您申请的元素background-image。适用于Firefox，Safari和Opera。例如：

<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>

来源

2012-08-24 12:33:17 Jay

现在它也可以在Chrome中使用 – Channel

关于到this文章，你应该使用cover还有：

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; 
}

来源

2016-05-17 19:15:04

CSS：100％的宽度和背景？

回答

相关问题