Colore di testo e sfondo in CSS

Colore di testo e sfondo in CSS
Cascading Style Sheets (CSS) è una lingua utilizzata per modellare le pagine Web scritte in HTML e XML. Questi fogli di stile consistono in un'enorme quantità di proprietà che possono essere utilizzate per migliorare l'aspetto delle pagine Web. Queste proprietà sono utili durante la formattazione di elementi di una pagina web. In questo articolo, ci concentreremo specificamente sulle proprietà utilizzate per applicare il colore e il colore di sfondo al testo su una pagina web.

Innanzitutto, esamineremo la proprietà a colori di CSS che può essere utilizzato per applicare il colore del testo che appare sulla pagina web.

Colore del testo

È possibile applicare il colore al testo su una pagina Web utilizzando la proprietà del colore di CSS. Ci possono essere tre approcci per applicare il colore al testo che sono i seguenti.

1. Usa il nome del colore

Il modo più semplice per applicare il colore al testo è usando il nome del colore. CSS supporta un totale di 140 nomi di colori come rosso, giallo, marrone, skyblue, ecc. Per esempio,

H1
colore blu;

2. Usa un codice di colore esagonale

Questi codici indicano intensità di colore primario e sono scritti usando tre coppie di caratteri. 00 rappresenta la più bassa intensità di un colore primario e FF rappresenta la massima intensità di un colore primario. Ad esempio, il codice esagonale di rosso è #FF0000, il blu è #0000FF, Brown è #964b00, ecc.

H1
Colore: #0000FF;

3. Usa un valore RGB

RGB è un modello di colore composto dai tre colori primari rosso, verde e blu. La gamma di valori di questi colori è da 0 a 255. 0 rappresenta la più bassa intensità di un colore primario e 255 rappresenta la massima intensità di un colore primario. Il valore RGB del blu è (0,0,255), il rosso è (255,0,0), il giallo è (255,255,0), ecc.

H1
Colore: RGB (255.255,0);

Vediamo un esempio di applicazione del colore a diversi elementi HTML.

Esempio
Nell'esempio seguente, abbiamo dimostrato tutti gli approcci sopra menzionati dell'applicazione di colori a diversi elementi HTML usando la proprietà a colori di CSS.







Questa intestazione è verde


Questa intestazione è blu


Questo paragrafo è rosso



Produzione

Il colore di

L'elemento è impostato su verde usando l'approccio del codice esadecimale, il colore di

L'elemento è impostato su blu usando l'approccio del nome colore e il colore di

L'elemento è impostato su rosso utilizzando l'approccio del valore RGB.

Ora che abbiamo una comprensione di base dell'applicazione del colore al testo, proviamo a capire come applicare il colore di sfondo agli elementi su una pagina web.

Colore di sfondo
È possibile applicare il colore di sfondo agli elementi su una pagina Web utilizzando la proprietà in background di CSS. Questo può essere fatto usando i tre approcci menzionati nella sezione sopra. Vediamo un esempio.

Esempio
Nell'esempio seguente, abbiamo dimostrato sia la proprietà del colore che la proprietà di sfondo di CSS.







Questo è un paragrafo





In quanto sopra, abbiamo usato i tre diversi approcci (nome colore, codice esadecimale, valore RGB) per dare il colore del testo e il colore di sfondo a tre diversi elementi (, e).

Produzione

Usando la proprietà colore e color sfondo, tutti e tre gli elementi vengono disegnati.

Conclusione

Utilizzando la proprietà a colori e color sfondo di CSS è possibile applicare colori e colori di sfondo al tuo testo in un documento HTML. Il colore può essere specificato usando il nome del colore, il codice esadecimale del colore o il valore RGB del colore. L'intervallo di valori di un codice esadecimale è da 00 a FF, mentre l'intervallo di valori di un valore RGB è da 0 a 255. Questi intervalli rappresentano le intensità dei colori primari. Questo articolo evidenzia in modo approfondito le proprietà del colore e del colore di sfondo di CSS con l'aiuto di esempi appropriati.