Come cambiare il colore del testo in HTML

Per cambiare il colore del testo in un documento HTML si può utilizzare il vecchio tag FONT del linguaggio HTML oppure un foglio di stile tramite il linguaggio CSS.

Come funziona il tag Font

Il tag Font è un vecchio tag del linguaggio Html che permette di modificare il carattere e il colore di una singola parola, di una frase o di un intero paragrafo del testo.

<FONT COLOR="[codice colore]"> testo </FONT>

Si tratta di un tag doppio del linguaggio Html, in quanto è composto da un tag di apertura e uno di chiusura.

Quando il browser incontra il tag <FONT> applica la formattazione al testo compreso tra il tag di apertura e il tag di chiusura.

Un esempio pratico

Ad esempio il colore rosso è associato al codice #FF0000. Si tratta di un codice RGB che indica al browser l'intensità i rosso, verde e blu tramite tre cifre esadecimali.

Nota. I codici RGB ti permettono di definire un vasto insieme di sfumature di colore. Nell'esempio avrei potuto scrivere semplicemente "red" al posto del codice #FF0000. Il risultato finale sul browser del computer è il seguente:

Poi indico il codice del colore nell'attributo COLOR del tag FONT.

Nel seguente esempio ho applicato il colore rosso su una singola parola della frase.

Questa parola è di colore <font color=#FF0000>rosso</font>

Il risultato finale sul browser è il seguente:

Questa parola è di colore rosso

Come si modifica il colore con il CSS

L'uso del tag font non è l'unico modo per colorare un testo. Si può ottenere il medesimo risultato anche tramite i fogli di stile CSS.

Come prima cosa creo una classe a cui associare il colore rosso e poi la applico al testo indicandola nell'attributo CLASS o ID del tag HTML.

Nell'esempio seguente ho applicato la classe colore-rosso alla parola "rosso" tramite il tag SPAN del linguaggio HTML.

<html>
<head>
<style type="text/css">
.stile1 { color: #FF0000 }
</style>
</head>
<body>
questa parola è di colore <span class="stile1">rosso</span>
</body>
</html>

Lo stile colore può essere applicato anche su un intero paragrafo. Ad esempio, posso applicare lo stile a tutto un paragrafo scrivendo nel seguente modo:

Questa parola è di colore rosso

In quest'ultimo esempio ho aggiunto l'attributo CLASS al tag <P> del linguaggio HTML. Il browser colora di rosso l'intera frase e non più soltanto una singola parola.

questa frase è di colore rosso

E' meglio usare il CSS e abbandonare il tag Font

L'uso del tag <font> è attualmente deprecato e un buon sviluppatore dovrebbe sempre modificare il colore dei testi con i fogli di stile.

Il linguaggio CSS consente di ottenere molti altri effetti grafici che altrimenti sarebbero impossibili da ottenere con il tag FONT.

Perché conoscere anche il tag Font? Semplicemente perché il tag FONT fa parte della storia dell'HTML.

Inoltre, malgrado sia deprecato, il tag FONT è ancora oggi molto utilizzato sul web per la sua semplicità ed è un tag HTML ancora valido ed è interpretato correttamente da tutti i browser. A volte è persino utile.

 


 

Segnalami un errore, un refuso o un suggerimento per migliorare gli appunti

FacebookTwitterLinkedinLinkedin
knowledge base

Libri di approfondimento
  1. Il linguaggio Html