PCdaZERO.it - Guida facile per usare il computer

Acquista o scarica gratis, i libri di "PC da Zero"

CREARE PAGINE WEB    >     Colorare lo sfondo ed il testo



pcdazero-vol-1-sesta-ed-180.jpg - 15,3 KB È uscita la Nuova edizione interamente a colori di
PC da zero Volume 1.

Acquistala ora a 28 euro comprese le spese di spedizione!

Clicca qui, per riceverla
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.







Link sponsorizzati