Per cambiare il colore del testo in HTML esistono diverse tecniche. La tecnica piรน diffusa fino a qualche anno fa รจ quella che prevede di utilizzare lโattributo color del tag <font>, tuttavia non si tratta di un approccio corretto e moderno. La tecnica corretta per assegnare un colore ad un testo in HTML prevede, infatti, lโutilizzo dei CSS. Vediamole entrambe.
Indice
Impostare un colore al testo mediante tag <font> (obsoleto)
ร la tecnica piรน vecchia e ancora oggi diffusa, soprattutto tra i โnon adetti ai lavoriโ. Vediamo un esempio di utilizzo del tag <font> per cambiare il colore di un testo HTML:
<p>
Scrivo una parola in <font color="red">rosso</font>
</p>
Nellโesempio qui sopra abbiamo impostato, per una parola del nostro paragrafo di testo, il colore rosso. Per farlo abbiamo valorizzato lโattributo color del tag <font> con valore โredโ (rosso), alternativamente avremmo potuto inserire un valore esadecimale in questo modo:
<font color="#FF0000">rosso</font>
Il risultato, da un ounto di vista visivo, sarebbe stato il medesimo: la parola โredโ, infatti, corrisponde al codice esadecimale #FF0000 (per una lista esaustiva di colori in HTML si puรฒ consultare lโelenco disponibile a questa pagina).
La tecnica appena vista รจ vivamente sconsigliata in quanto lโutilizzo del tag <font> รจ deprecato dalle nuove specifiche del linguaggio HTML, nonchรฉ contraria alle direttive del W3C che prevedono una netta separazione tra la struttura (HTML) e la presentazione (CSS) del documento.
Impostare un colore al testo mediante CSS
Lโutilizzo di CSS รจ la strada preferibile per impostare un colore al testo allโinterno di una pagina web. Per farlo si utilizzerร , quindi, una classe ad hoc (definita in un foglio di stile esterno) oppure valorizzando opportunamente lโattributo style del tag contenitore del testo che si desidera colorare.
Vediamo degli esempi che chiariranno meglio quanto appena detto.
Definire una classe
Come detto รจ possibile definire una classe allโinterno del nostro foglio di stile (che andremo a definire allโinterno dei tag <head> e </head>) al fine di applicare un dato colore ad una stringa di testo, ad esempio:
<style type="text/css">
.testo-rosso {
color: #FF0000;
}
</style>
Da utilizzare in questo modo allโinterno del documento HTML:
<p>
Scrivo una parola in <span class="testo-rosso">rosso</span>
</p>
Nel nostro esempio abbiamo applicato la classe ad un tag <span>, ma nulla ci vieta di applicarla ad altre tipologie di contenitori come paragrafi o div.
Impostare il colore mediante stile in linea
In alternativa, avremmo potuto impostare un colore al testo attraverso lโutilizzo dellโattributo style, definendo uno stile in linea per lโelemento della pagina. Vediamo un esempio:
<p>
Scrivo una parola in <span style="color: #FF0000;">rosso</span>
</p>
Questa sintassi รจ preferibile quando non si ha la possibilitร di gestire un foglio di stile oppure quando la stilizzazione debba essere utilizzata una volta sola (quindi sarebbe inutile definire una classe ad hoc).
Qual รจ la tecnica migliore?
Come detto, lโutilizzo del tag <font> รจ oggi da considerarsi deprecato, pertanto il suo utilizzo non puรฒ che essere sconsigliato. Va segnalato, tuttavia, che il tag <font> รจ ancora perfettamente riconosciuto e interpretato da tutti i browser in circolazione, pertanto, da un punto di vista funzionale, il suo utilizzo consente di raggiungere lo scopo desiderato.
Qualora si abbia la possibilitร , tuttavia, lโutilizzo di CSS appare certamente la scelta preferibile, in quanto quella in grado di offrire una miglior compatibilitร anche e soprattutto in prospettiva futura (oltre ad essere lโunica soluzione qualora si desideri realizzare pagine web โvalideโ da un punto di vista sintattico).