WebSite X5Help Center

 
Fabrizio R.
Fabrizio R.
User

Help un buon codice adattamento background  it

Autore: Fabrizio R.
Visite 1108, Followers 1, Condiviso 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?

:) 

Postato il
3 RISPOSTE - 2 UTILI
Mirko Boschetti
Mirko Boschetti
Moderator

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

Leggi di più
Postato il da Mirko Boschetti
Fabrizio R.
Fabrizio R.
User
Autore

ok :)

Leggi di più
Postato il da Fabrizio R.
Esse Di
Esse Di
User

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

Leggi di più
Postato il da Esse Di