CSS colori

Valori di colore

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.

CSS nomi dei colori

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).

Esadecimali colori

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.

RGB colori

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.

Testo a colori

Il color proprietà può essere utilizzato per modificare il colore del testo. Esso può essere applicato a qualsiasi elemento HTML che contiene il testo.

CSS colore

p {color:green}

Uscita

Colore di sfondo

Il background-color proprietà può essere utilizzato per modificare il colore di sfondo di quasi tutti gli elementi HTML.

CSS background-color

p {background-color:yellow}

Uscita