Puoi specificare colori, dimensioni e altri parametri dei caratteri in un foglio di stile CSS esterno. Se vuoi cambiare il colore di una sola parola o frase, tuttavia, il modo più semplice e semplice è usare il tag in linea. Il CSS in linea è proprio come sembra: viene aggiunto nell'HTML della pagina, piuttosto che in un foglio di stile esterno.
Evita di utilizzare il tag, che è stato deprecato.
Ecco come cambiare il colore di una parola usando il tag:
Utilizzando il tuo editor di testo o HTML preferito in modalità di visualizzazione del codice, posiziona il cursore prima della prima lettera della parola o del gruppo di parole che desideri colorare.
Avvolgiamo il testo di cui vogliamo cambiare il colore con un tag, incluso un attributo di classe. L'intero paragrafo potrebbe avere questo aspetto: Questo è il testo su cui si concentra una frase.
-
Dai a quel testo specifico un "gancio" che possiamo usare nei CSS. Il nostro prossimo passo è passare al nostro file CSS esterno per aggiungere una nuova regola.
Nel nostro file CSS, aggiungiamo:
.focus-testo {
colore: #F00;
}
Questa regola imposterebbe quell'elemento in linea, the, da visualizzare nel colore rosso. Se avessimo uno stile precedente che impostava il testo del nostro documento su nero, questo stile in linea farebbe sì che il testo dell'estensione fosse focalizzato e risaltasse con il diverso colore. Potremmo aggiungere anche altri stili a questa regola, magari rendendo il testo corsivo o grassetto per enfatizzarlo ancora di più?
-
Salva la tua pagina.
Prova la pagina nel tuo browser web preferito per vedere le modifiche in vigore.
Nota che oltre a, alcuni professionisti del web scelgono di utilizzare altri elementi come le coppie di tag o. Questi tag erano usati specificamente per il grassetto e il corsivo, ma sono stati deprecati e sostituiti con e. I tag funzionano ancora nei browser moderni, tuttavia, molti sviluppatori web li usano come hook di stile in linea. Questo non è l'approccio peggiore, ma se vuoi evitare elementi deprecati, ti suggeriamo di attenersi al tag per questo tipo di esigenze di stile.
Suggerimenti e cose a cui prestare attenzione
Sebbene questo approccio funzioni bene per piccole esigenze di stile, ad esempio se è necessario modificare solo una piccola parte di testo in un documento, può perdere rapidamente il controllo. Se trovi che la tua pagina è piena di elementi in linea, che hanno tutti classi univoche che stai utilizzando nel tuo file CSS, puoi lo stai facendo male, ricorda, più di questi tag ci sono nella tua pagina, più è probabile che sia difficile mantenere quella pagina in corso inoltrare. Inoltre, una buona tipografia web raramente ha così tante varianti di colore, ecc. tutta la pagina.