CREARE PAGINE WEB - Colorare lo sfondo ed il testo
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">
<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"><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.
Ti potrebbe interessare anche...
Fare calcoli e creare elenchi con
- Come creare un blog gratis
- Come creare siti web gratis
- Gestisci le tue foto con Picasa
- Naviga veloce con Google Chrome
- Scarica video e musica con Free Studio
Frasi celebri
“Se non lo sai spiegare in modo semplice, non l'hai capito abbastanza bene” (Albert Einstein).