Effetto sfumato

[GiovanniP]

Come posso creare un effetto di sfumato in una box con i css, senza utilizzare un' imaggine di background ?

[paologaz]

Per quello che ne so, non si può, se devi fare lo sfondo sfumato devi crearti un' immagine ad arte, se devi fare un bordo sfumato devi crearti un' immagine da posizionare dietro il box spostando la posizione di pochi pixel e usando position: relative.
Forse si può fare con javascript

[GiovanniP]

up

[gabip87]

giusto 2 giorni fa c'era un'altro nella sezione html che lo chiedeva. devi usare per forza un'immagine. se non sbaglio c'era anche la possibilita' di farlo con il codice ma sicuramente (se esiste) funziona soltanto con IE. creati l'immagine che fai prima.

[codicealpha]

confermo..

ti fai un'immagine gradiente e poi vai di

background-image: url(sfondo.jpg);
background-image: repeat-y (o x)

[GiovanniP]

ho creato un' immaggine sfumata che va dal verde al giallo e l' ho ripetuta in orizzontale e verticale.
Ma verticalmente, quando l' immagine viene ripetuta, si passa improvvisamente dal giallo al verde.
Come posso fare in modo che l' effetto verde -> giallo si allunghi uniformemente per tutta la pagina ?

[codicealpha]

dipende allora.. fai una così



se vuoi una ripetizione in orizzontale.. quindi metterai background-repeat: repeat-x;

sennò posta l'immagine e facci capire come vuoi che diventi..

[GiovanniP]

Vi posto l' immagine (ho cambiato i colori).
La pagina deve avere come sfondo quello stesso effetto sfumato

[codicealpha]

ok.. dato che la lunghezza della pagina non la sai xke varia.. devi decidere se tenerla in fondo la sfumatura o all'inizio..

nel caso la tieni all'inizio.. nel body devi mettere

background-color: #FFF907; //colore finale
background-image: url(immagine.jpg);
background-repeat: repeat-x;

nel caso la tieni al fondo.. nel body devi mettere

background-color: #FFCC33; //colore inizio
background-image: url(immagine.jpg);
background-repeat: repeat-x;

[GiovanniP]

io vorrei mantenere l' effetto sfumato per tutta la pagina.
Qui é il problema !