Ecco le principali proprietà per gestire lo sfondo da un foglio di stile
CSS:
background-color
background-image
background-repeat
background-attachment
background-position
/* BACKGROUND-COLOR
Definisce il colore dello sfondo di un dato elemento
*/
body {background-color: white; }
body {background-color:#FFFFFF; }
body {background-color: rgb(0, 0, 0); }
/* BACKGROUND-IMAGE
Definisce il percorso dell'immagine da usare come sfondo di un elemento */
body {background-image: url(sfondo.gif); }
body {background-image: url(http:\\.....gif); }
/* BACKGROUND-REPEAT
Questa
proprietà definisce la direzione in cui l'immagine di sfondo viene ripetuta */
selettore {background-repeat: <valore>; }
body {
background-image: url(sfondo.gif);
background-repeat: repeat;
}
div {
background-image: url(sfondo.gif);
background-repeat: repeat-x;
}
/*Valori:
-
repeat L'immagine viene ripetuta in orizzontale e verticale. (comportamento standard. )
- repeat-x L'immagine viene ripetuta orizzontalmente.
- repeat-y L'immagine viene ripetuta ;verticalmente.
-
no-repeat L'immagine non viene ripetuta.(viene ripetuta solo una volta)*/
/* BACKGROUND-ATTACHMENT
Con questa proprietà si decide se essa deve scorrere insieme al contenuto o se deve rimanere fissa.*/
selettore {background-attachment: <valore>; }
/*Valori
-
scroll L'immagine scorre con il resto del documento quando si fa lo scrolling della pagina
- fixed L'immagine rimane fissa mentre il documento scorre */
/* BACKGROUND-POSITION
questa proprietà definisce il punto in cui verrà posizionata l'immagine di sfondo(la prima, nel caso venisse ripetuta)*/
selettore {background-position: <valore> o <valori>; }
body {
background-image: url(sfondo.gif);
background-repeat: no-repeat;
background-position: 50px 50px;
}
body {
background-image: url(sfondo.gif);
background-repeat: no-repeat;
background-position: center center;
}
powered by IMHO
Print | posted on mercoledì 23 febbraio 2005 14:09