Usare font non-family per il testo grazie a Google Fonts

Corso online Responsive Design
Realizzare siti responsivi con HTML5 e CSS3.

Scritto da Luca Ruggiero nella sezione Css

Grazie a Google è possibile utilizzare per le proprie pagine Web dei font cosiddetti non family, ovvero non i classici Verdana, Arial, Times New Roman e cosi via, sfruttando le API del servizio Google Fonts in modo completamente gratuito.

E' sufficiente importare nelle proprie pagine Web il la URL della pagina di Google:

<link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=XYZ">

sostituendo a "XYZ" il nome del font che si desidera utilizzare, ad esempio il Tangerine.

A questo punto stilizzeremo i nostri paragrafi:

<style style="text/css">
p
{
    font-size: 50px;
    font-family: Tangerine;
}
</style>

e ne creeremo uno di test:

<p>Google, grazie di esistere!</p>

Il risultato sarà il seguente:

 

Google, grazie di esistere!

 

L'elenco dei font è disponibile consultando il sito Google Fonts Directory.

I più cliccati della sezione Css

:: Effetto testo barrato con con i Css (43.222)

:: Referenze dei fogli di stile Css (41.354)

:: Menu ad effetto mouseover con i Css (38.148)

:: Effetti sui link con i Css (27.364)

:: Testo verticale coi Css (19.214)

:: Angoli smussati in un box coi Css (18.509)

:: Posizionare un layer centrato rispetto alla risoluzione con i Css (15.734)

:: Box con effetto ombra con i CSS3 (15.452)

:: Stilizzare i form Html con i Css (15.219)

:: CSS Expression, ovvero: integrare Javascript in un foglio di stile (14.888)

IN EVIDENZA
DOWNLOAD