CSS: larghezza e sfondo del 100%?

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

fonte

2012-08-23 micobg

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

Usa larghezza di sfondo: 960px; invece di larghezza: 100%; Cheers

fonte

2012-08-23 14:08:59

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>

fonte

2012-08-24 12:33:17 Jay

Ora funziona anche in Chrome – Channel

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

fonte

2016-05-17 19:15:04

CSS: larghezza e sfondo del 100%?

risposta

Problemi correlati