December 29
La proprietà CSS background-image può aggiungere stile, colore e elementi di design di un'intera pagina web o ad una piccola parte di una pagina web. Ecco come realizzarla.
1 Salvare un'opacità bassa, meno copia saturi della tua immagine sfondo della pagina. La pagina di sfondo deve essere discreto e non interferire con il contenuto della pagina.
2 Uno sfondo può ripetere o essere impostato su no-repeat. Per rendere una pagina intera sfondo delle balle di fieno sopra indicato, la scelta migliore è no-repeat. Per un'intera pagina di sfondo, una grande immagine che è centrata sia orizzontalmente che verticalmente sulla pagina con background-position funziona bene.
3 
Applicare la regola al selettore corpo per creare una pagina intera di sfondo. Ecco un esempio utilizzando le impostazioni suggerite al punto 2.
body {
background-image: url(somebg.jpg);
background-repeat: repeat;
background-position: center center;
}
4 Regolare il background-position secondo la vostra immagine. Per esempio:
background-position: a sinistra sopra;
potrebbe essere una scelta migliore per alcune immagini. Tale norma pone l'immagine orizzontalmente a sinistra, e verticalmente in alto.
5 Con i CSS, tutto può avere una immagine di sfondo: una lista, un div, un paragrafo, una voce un arco. Qualsiasi cosa.
6 A seconda di quale elemento si sceglie per un'immagine di sfondo, può essere utilizzato come un elemento di design, un sistema di navigazione, per portare contrasto o attenzione all'elemento o per definire una parte di una pagina.
7
Utilizzare il programma di editing di immagini per creare un'immagine in base alle esigenze e finalità, come suggerito nella Fase 2. A titolo di esempio, ecco un po 'piccolo del campo di fieno dall'immagine grande.
8 
Come esempio, l'immagine verrà utilizzata come sfondo per un elemento h1. Ecco una possibile regola CSS:
h1 {
background-image: url(h1bg.jpg);
background-repeat: repeat;
background-position: center center;
}