Help un buon codice adattamento background
Auteur : Fabrizio R.
Visité 1226,
Followers 1,
Partagé 0
ho provato molti codici per adattare un immagine sfondo a tutte le risoluzioni monitor ma quasi tutte mi tagliano sempre una picc parte... :( avevo un codice che sfigatamente lo perso :( e mi adattava l immagine tutta anche se la inserivo dimensione 1920x1080 qualsiasi dimensione me l'adattava molto bene , non e' che qualcuno ha un bel codice background da suggerirmi?
:)
Posté le
se non ti accontenti della funzione che dà già il programma, prova con questo:
<style>
html {
background: url(files/tuaimmagine.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
</style>
metti il nome della tua immagine...
Auteur
ok :)
"background-size: cover" è esattamente il codice impostato dal programma selezionando "Adatta al contenuto della finestra" per l'immagine di sfondo.
La proprietà riempie la finestra ma, per mantenerne inalterate le proporzioni, è costretta a tagliare l'immagine in larghezza o in altezza se il rapporto tra le sue dimensioni non coincide con quello delle dimensioni della finestra.
Per riempire la finestra senza tagliare l'immagine, occorre impostare "background-size:100% 100%;". Ovviamente, così facendo, se le proporzioni della finestra sono diverse da quelle dell'immagine, quest'ultima risulterà deformata.
Sicuramente è preferibile la prima soluzione, per la quale, ripeto, non è necessario nessun codice esterno.
Non sono affatto sicuro cha sia quello che vuole l'autore del topic, considerata questa sua affermazione: "ma quasi tutte mi tagliano sempre una picc parte..."
Per vedere gli effetti delle varie opzioni di background-size, si può andare su
http://www.w3schools.com/cssref/playit.asp?filename=playcss_background-size&preval=50%