2'

Modificare il testo con i CSS: come fare

Una tra le principali regole che possiamo utilizzare per personalizzare il testo risulta essere la regola font, una regola che permette di impostare diversi valori in grado di modificare il testo. Ecco a voi la sintassi necessaria di questa regola.

I commenti che ho inserito all’interno dell’immagine dovrebbero farci capire che questa regola permette di modificare il valore di un gran numero di sotto-regole che altrimenti avremmo dovuto inserire una ad una. 

Come possiamo vedere dall’esempio, rirefendoci al valore di font-variant, se non vogliamo modificare il valore di una determinata regola, ci sarà sufficiente omettere il nuovo valore per permettere al browser di andare a ereditare il valore dal suo contenitore o, come in questo caso, di prendere il valore di default per tale regola.

Adesso che conoscete questo concetto, applicabile a tutte le regole che si comportano come insieme di altre regole, come ad esempio la regola background, possiamo capire che le seguenti dichiarazioni sono tutte valide e corrette.

Adesso che sappiamo come si comporta questa proprietà andiamo a vedere da vicino altre proprietà che ci permettono di personalizzare il testo.

Una delle proprietà molte utili da utilizzare per personalizzare il proprio testo risulta essere text-align che ci permetterà di sistemare gli allineamenti del testo rispetto al suo contenitore, come nell’esempio presentato qua sotto:

Ecco un’altra regola CSS in grado di personalizzare il testo e che molto probabilmente vedete tutti i giorni navigando per il web ma che non avete mai preso in considerazione. Infatti questa proprietà vi permette di agiungere una linea ai vostri testi, proprio come accade per i link.

Questa regola può essere impostata utilizzando quattro valori differenti che vado subito a presentarvi:

  • none - che come abbiamo visto è il velore di default e non mostra alcuna decorazione;
  • underline - come nei link, questo valore ci permette di mostrare del testo sottolineato;
  • overline - al contrario del precedente valore la sottolineatura si posiziona sopra al nostro testo;
  • line-through - specificando questo valore potremmo barrare orizzontalmente il testo per tutta la sua lunghezza.

 

Abbiamo appena visto come sia possibile trasformare il testo e quali regole siano tra le più utilizzate per questo compito; ne esistono di molte altre ma le andremo a vedere con più calma procedendo questa guida.