Nella mia pagina sono presenti 2-3 sezioni con larghezza e sfondo del 100%. Quando lo apro a schermo intero è tutto ok ma quando lo schermo è più piccolo di 960px (larghezza del contenuto in questa sezione) l'immagine di sfondo non è l'intera pagina. Il lato destro whis è nascosto in primo momento non hanno sfondo - è bianco. Puoi vedere cosa intendo qui: http://micobg.net/10th/CSS: larghezza e sfondo del 100%?
9
A
risposta
2
Usa larghezza di sfondo: 960px; invece di larghezza: 100%; Cheers
18
Basta aggiungere lo stile background-size:100%
all'elemento in cui è stato applicato background-image
. Funziona con Firefox, Safari e Opera. Per esempio:
<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>
+0
Ora funziona anche in Chrome – Channel
3
Riguardo al this articolo, si dovrebbe utilizzare cover
così:
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;
}
leggere questo: http://www.whatstyle.net/articles/48/css_tricks_1_100_percent_width_in_a_variable_width_container – diEcho
Si può trova informazioni utili in [stackoverflow.com/questions/2083831/css-background-image-does-not-fill-when-scrolling](http://stackoverflow.com/questions/2083831/css-background-image-does- not-fill-when-scrolling) – utsikko