Web Design

La gestione degli sfondi con i CSS

Grazie ai CSS è possibile applicare uno stile allo sfondo di un elemento. Si tratta in particolare delle seguenti proprietà:

background-color

background-image

background-reapet

background-attachment

background-position

Vediamole in dettaglio.

Se alcune proprietà sono state sono state definite per lo stesso selettore da diversi fogli di stile, il valore sarà ereditato dal foglio di stile più specifico. 

Per esempio un foglio di stile esterno definisce lo stile seguente per un selettore h1:

h1
{
color: red;
text-align: left;
font-size: 8px;
}

Al tempo stesso un foglio di stile interno definisce queste proprietà per lo stesso selettore:

h1
{
text-align: right;
font-size: 20px;
}

Nel caso in cui la pagina con il foglio di stile interno risulti anche collegata al foglio di stile esterno, le proprietà per il selettore h1 saranno:

color: red;
text-align: right;
font-size: 20px;

Il colore viene ereditato dal foglio di stile esterno mentre per l’allineamento del testo e la dimensione del font vengono utilizzati i valori contenuti nel foglio di stile incorporato.

Facciamo un piccolo passo indietro e vediamo come inserire un foglio di stile CSS all’interno di un documento. Innanzi tutto bisogna distinguere tra:

• Fogli di stile esterni
• Fogli di stile interni
• Stili in linea