CSS, acronimo di Cascading Style Sheet, ha una proprietà utile di BG che è possibile utilizzare per migliorare i vostri siti Web. La BG, o proprietà background, consente agli sviluppatori di inserire immagini di sfondo di una pagina Web in una varietà di modi. BG dispone inoltre di un parametro di colore che è possibile utilizzare per aggiungere colore alle pagine. Imparando alcune regole CSS, è possibile creare e aggiornare i tuoi sfondi rapidamente con poche righe di codice CSS.

Istruzioni

1

Avviare Blocco note e aprire uno dei documenti HTML.

2

Individuare la sezione "head" del documento e incollare questo codice all'interno di quella sezione:

< style type = "text/css" >

corpo

{background-color: blue;}

< / stile >

Questo codice CSS crea uno sfondo blu per la tua pagina Web.

3

Cambiare quel colore ad un altro colore come il rosso o verde e salvare il documento. Aprirlo nel browser e visualizzare la pagina Web. Lo sfondo sarà il colore selezionato.

4

Tornare al documento HTML. Sostituire il codice precedente con questo codice CSS:

< style type = "text/css" >

corpo

{

immagine di sfondo: URL('xyz.gif'); background-repeat: repeat;

}

< / stile >

Sostituire "xyz.gif" con il nome di un file di immagine di piccole dimensioni sul disco rigido. Utilizzando il tag "immagine di sfondo" fa sì che l'immagine che si sceglie di apparire come sfondo di una pagina Web. La proprietà "background-repeat" determina se quell'immagine viene ripetuta o non. In questo esempio, il valore della proprietà è "ripetere".

5

Salvare il documento e visualizzarlo nel browser. La pagina Web vi mostrerà un piastrellato, ripetizione della priorità bassa.

6

Torna al documento HTML ed eliminare il codice CSS. Incollare il codice seguente al suo posto:

< style type = "text/css" >

corpo

{

immagine di sfondo: URL('xyz.jpg'); background-repeat: no-repeat; background-position: 100px 200px;

}

< / stile >

Sostituire "xyz.jpg" con il nome di un'immagine più grande sul disco rigido. Si noti che il "background-repeat" ha un valore di "no-repeat." Ciò impedisce che il browser ripetendo l'immagine. Il valore di "background-position" consente di posizionare l'immagine nella pagina Web. In questo caso, il primo valore, "100px", pone l'immagine 100 pixel dal bordo sinistro della pagina. Il valore di "200px" mette l'immagine di 200 pixel dalla parte superiore.

7

Modificare questi valori in pixel per qualcosa che ti piace. Salvare il documento HTML e aprirlo nel browser. Verrà visualizzata un'immagine singola, non ripetuta nel percorso che è impostato nel file CSS.

Consigli & Avvertenze

• Ci sono altre proprietà che è possibile impostare per controllare il posizionamento e l'allineamento delle immagini di sfondo. Ad esempio, anziché specificare posizione di un'immagine in una pagina utilizzando pixel, è possibile utilizzare parole chiave come "sinistra" e "top". Libri e tutorial HTML online possono aiutarti ad imparare queste proprietà di sfondo.