Cambiare la dimensione del font (la “font size”) usando il css non è troppo difficile: in questo articolo vedrai in breve tempo come modificare il font nella sua dimesione tramite il codice CSS.
Cosa devo fare?
Semplicemente inizia a scrivere “<style>” appena dopo il tag “<head>” così da cominciare la scrittura col css; nella riga successiva scriviamo le proprietà della classe del testo a cui vogliamo riferirci, quindi in questo caso la classa a cui ci riferiamo è per prima la classe “souvlaki” (è un nome a caso ovviamente, giusto per fare un esempio col nome di qualcosa di buono) mentre la seconda è la classe “kalamaki” e la terza “pita”.
Iniziamo a definire quindi le classi:
- div.souvlaki
- div.kalamaki
- div.pita
Al fianco di ogni classe css dovremo impostare lo stile del font, quindi dovremo scrivere “{ font-size: 10px; }” (dove 10px è un esempio, ovviamente a seconda della grandezza del numero di px scelto cambierà anche la dimensione del testo, che aumenterà con l’aumentare del valore numerico; nella seconda classe (kalamaki) mostriamo come modificare la dimensione del testo, in questo caso poniamo “smaller” ma possiamo anche scrivere “larger” o altri comandi a seconda della situazione voluta.
Finita qui? No! Possiamo ancora usare un terzo modo per modificare il font col css, ovvero impostare la font-size, scrivendo ad esempio “font-size: 120%”, come facciamo ad esempio nella terza classe d’esempio, chiamata “pita”.
Esempio modifica del font size in css (codice)
Ecco il codice dell’esempio:
<head>
<style>
div.souvlaki { font-size: 10px; }
div.kalamaki { font-size: smaller; }
div.pita { font-size: 120%; }
</style>
</head>
<body>
<h1>I miei piatti preferiti della Grecia sono il souvlaki kalamaki e la pita</h1>
<div class="souvlaki">Questo testo è dedicato al souvlaki</div>
<div class="kalamaki">Questo testo è dedicato al souvlaki kalamaki</div>
<div class="pita">Questo testo è dedicato alla pita</div>
</body>