Per migliorare la tipografia e la leggibilità del proprio blog o sito web, è sempre necessaria una buona combinazione di caratteri. A tale scopo, è possibile utilizzare dei caratteri personalizzati utilizzando la proprietà @font-face nel foglio di stile CSS del proprio blog. Trovando così il giusto e desiderato aspetto dei caratteri, i propri lettori potranno godere di una migliore leggibilità e di una migliore esposizione dei contenuti sul proprio blog o sito web.
Ci sono vari metodi per incorporare font personalizzati sul vostro sito web, ma quello che vedremo qui, è il modo più semplice ed efficace per usare font personalizzati con CSS. Non richiede conoscenze particolari se non un minimo di familiarità con CSS. Vediamo dunque come fare.
Fonts personalizzati in CSS con @font-face
Presupposto all’utilizzo della proprietà è quello di avere disponibile il font in formato True Type (. Ttf file). Potete usare il vostro editor di testo per modificare il file del foglio di stile del proprio sito web o blog.
Esempio
|
1 2 3 4 |
@font-face { font-family: 'Roboto'; src: url('/www.pixolo.it/wp-content/uploads/2012/07/Roboto-Regular.ttf'); } |
Quindi riassumendo, aprire il file di stile CSS del proprio tema o sito web e aggiungere la proprietà @font-face nella parte superiore del file CSS. Tale proprietà definisce l’acquisizione di un tipo di carattere esterno in formato True Type.
|
1 2 3 4 |
@font-face { font-family: 'nome-font'; src: url('url-del-font-TTF'); } |
Fatto semplicemente ciò, sarà ora possibile utilizzare il vostro tipo di carattere personalizzato in qualsiasi parte del vostro blog richiamandolo semplicemente tramite la proprietà font-family. È inoltre possibile utilizzare più i caratteri esterni nel medesimo modo, magari in parti diverse del proprio blog o sito web.
Esempio di utilizzo del font personalizzato
|
1 2 3 4 5 6 7 |
body { background: #fff; font-size: 14px; font-family: 'Roboto', Lucida Sans Unicode, 'Lucida Grande', sans-serif; font:weight: normal; text-align: center; } |
Buon lavoro!
| Articolo pubblicato 5 anni fa nella categoria 
