CSS permette di specificare colori a 24 bit (che è 16.777.216 colori!) Per le proprietà, come il colore del testo, colore di sfondo e colore del bordo per rendere la tua disegni e modelli. È possibile utilizzare nomi di colori, notazione esadecimale o RGB (rosso, verde, blu) notazione.
Per rendere le cose più facili, CSS comprende 16 nomi di colori standard in parole povere, così come più di 100 nomi di colori estesa. Ecco un elenco di quelli standard:
| Nome colore | Uscita |
|---|---|
| aqua | |
| black | |
| blue | |
| fuchsia | |
| gray | |
| green | |
| lime | |
| maroon | |
| navy | |
| olive | |
| purple | |
| red | |
| silver | |
| teal | |
| white | |
| yellow |
Inoltre è possibile impostare un valore di colore a uno nessuno o trasparente per evitare che l'elemento di disegno di qualsiasi colore (altri elementi dietro di essa sarà visibile attraverso).
Anche se i nomi dei colori sono disponibili in tutto a portata di mano a volte, sono troppo pochi per soddisfare ogni design. Per sfruttare l'intera gamma di colori a 24 bit è possibile utilizzare i valori esadecimali.
I colori esadecimali sono costituiti da un segno # libra seguita da un numero di 6 cifre esadecimali, come #ff065c . Le prime 2 cifre rappresentano la componente di colore rosso, la seconda coppia è il verde e il terzo è la componente blu. Il loro valore può variare da 00 a FF, #000000 essere nero e #ffffff di essere bianco.
| Hex colore | Uscita |
|---|---|
| #000 | |
| #3b948d | |
| #aed527 | |
| #ff7612 | |
| #fff |
Forse avete notato che ho scritto #000 invece di #000000 per la visualizzazione di colore nero. Questa è una sigla che indica la cifra di ogni coppia solo una volta se ogni coppia è costituita da le stesse cifre. Per esempio #eeeeee può essere scritta come #eee , #3399cc come #39c e così via. Utilizza questo laddove possibile, di ridurre le dimensioni del codice CSS.
Ultimo ma non meno importante è anche possibile specificare i valori di colore utilizzando il modello RGB (rosso, verde, blu). E 'fondamentalmente come i colori esadecimali, ma invece di coppie di hex stai usando valori decimale da 0 a 255 per ciascun componente di colore, come rgb(red,green,blue) .
| RGB color | Uscita |
|---|---|
| rgb(0,0,0) | |
| rgb(59,148,141) | |
| rgb(174,213,39) | |
| rgb(255,118,18) | |
| rgb(255,255,255) |
Si può già vedere che la notazione RGB produce codice più lungo rispetto alla notazione esadecimale, mentre facendo esattamente la stessa cosa. Per questo motivo RGB è usato raramente in esadecimale. La maggior parte grafica colori di visualizzazione del software sia in RGB e esadecimale comunque.
Il color proprietà può essere utilizzato per modificare il colore del testo. Esso può essere applicato a qualsiasi elemento HTML che contiene il testo.
Il background-color proprietà può essere utilizzato per modificare il colore di sfondo di quasi tutti gli elementi HTML.