CREARE PAGINE WEB > Colorare lo sfondo ed il testo

I 3 Manuali
fondamentali per l uso del computer
12% di sconto

Acquista ora a soli 75 euro

Clicca qui, per riceverli
comodamente a casa tua.

Questa lezione non è aggiornata ma è liberamente consultabile.
Se vuoi acedere alle lezioni riguardanti la creazione di pagine web con HTML,
vai al seguente sommario: Creare siti web in HTML e CSS.

CAMBIARE LO SFONDO DI UNA PAGINA WEB

Se desideri cambiare il colore allo sfondo della tua pagina web, puoi aggiungere un attributo al tag <body> in questo modo:
<body style="background-color:black">
In questo caso è stato scelto lo sfondo nero (black).
Il codice completo della pagina, potrebbe essere il seguente:

<html>

<head>

<title>Pagina nera</title>

</head>

<body style="background-color:black">

Lo sfondo della pagina è nero.

</body>

</html>

Suggerimento (per chi ancora è "alle prime armi"):
invece di trascrivere il testo a mano,
- selezionalo con il mouse,
- cliccaci sopra con il tasto destro
- scegli il comando copia
- apri il blocco note,
- tasto destro e incolla.

Ed il risultato sarà una pagina completamente nera.
Il testo scritto tra i tag body non è più leggibile (perché il colore predefinito del testo è nero).
Devi quindi cambiare il colore anche al testo.

CAMBIARE COLORE AL TESTO

Puoi cambiare colore al testo della pagina in questo modo:
<body style="background-color:black; color:white">

Quindi il codice completo della pagina sarà:

<html>

<head>

<title>Pagina nera</title>

</head>

<body style="background-color:black; color:white">

Lo sfondo della pagina è nero. Il testo è
bianco.

</body>

</html>

Il risultato è una pagina nera con il testo bianco.

UN PICCOLO ELENCO DEI COLORI

Riassumendo:
L'attributo background-color cambia il colore allo sfondo.
L'attributo color cambia il colore al testo.
I valori black e white, sono i rispettivi colori nero e bianco.

Potrai sostituire black e white, con i seguenti altri colori:

aqua

blue

fuchsia

gray

green

lime

maroon

navy

olive

purple

red

silver

teal

yellow

ESERCIZI SUI COLORI

Esercitati a creare delle pagine con degli sfondi e testi di diverso colore.
Ad esempio crea una pagina inserendo questo codice:

<body style="background-color: yellow; color:
maroon">

Crea un'altra pagina inserendo questo codice:

<body style="background-color: olive; color: aqua
">

TUTTI I COLORI

Usando dei valori numerici, potrai inoltre usufruire ti tutte le sfumature dei colori.
In alternativa ai valori espressi con i nomi, tipo black e white, potrai usare rispettivamente i valori rgb(0,0,0) e rgb(255,255,255).
Scrivere:

<body style="background-color:black;
color:white">

equivale a scrivere:

<body style="background-color: rgb(0,0,0); color:
rgb(255,255,255)">

La sigla rgb sta ad indicare i colori Red (rosso), Green (verde) e Blue (blu).
I numeri tra parentesi, si riferiscono rispettivamente a questi tre colori.
I numeri sono compresi tra 0 e 255.
Più il numero è alto e più il colore è intenso.
Prendiamo ad esempio il rosso (r - red)
Per creare il colore rosso dovrai usare il seguente codice: rgb(255,0,0)
Per il colore verde (g - green) rgb(0,255,0)
Per il colore blu (b - blue) rgb(0,0,255)
Il colore giallo è la combinazione del colore rosso con il verde e quindi il suo codice è rgb(255,255,0)
Puoi miscelare i tre colori rgb, cambiando i numeri a piacimento.
Ad esempio:

rgb(20,110,230)

rgb(100,80,100)

rgb(80,180,50)

e così via.

Non allarmarti, in seguito non dovrai digitare numeri per scegliere i colori.
Userai programmi appositi che con un semplice clic su quadratini colorati, inseriranno automaticamente il codice corrispondente.

PCdaZERO.it - Guida facile per usare il computer