|
Home -> Manuali e Tutorials -> Guida CSS -> Formattazione del Testo (1/4)
Scarica il tutorial  | Stampa il tutorial  | Cerca nel sito 
IMPOSTARE DEGLI EFFETTI CSS SUI FONT
Vediamo ora come impostare dei semplici CSS su una scritta; vedremo come scegliere il colore ed il font di un testo, la sua dimensione e stile.
Colore
Per fissare il colore del testo una volta per tutte bisogna scrivere nel foglio di stile:
E' inoltre possibile fissare un diverso colore per l'intestazione, o magari per il testo in corsivo:
| h1 { color : #660099 } |
em { color : #000000 } |
Così, in modo automatico, tutte le intestazioni ed il testo in corsivo verranno scritte con tali colori prefissati.
Scelta del Font
Si può scegliere di usare un particolare Font per l'intera pagina, usando la seguente dicitura:
| body { font-face:"Verdana"; } |
E' anche possibile inserire più di un font all'interno delle " ", così che, se il primo non è riconosciuto dal browser, viene usato il secondo font.
L'elemento di stile font-face consente di scegliere un font per una pagina oppure per una parte di essa. In altre parole, scrivendo un pagina con il font predefinito, essa apparirà nel browser con il carattere indicato come valore dell'elemento font-face. Invece l'elemento di stile font-family consente di stabilire una "famiglia" di font; un esempio è il Times, la cui famiglia è costituita da più singoli fonts, quali TimesRegular, TimesBold, TimesItalic, TimesOblique, TimesBoldItalic, TimesBoldOblique, etc. Ognuna delle varianti del Times rientra quindi nel font face.
I "Serif fonts" sono costituiti da lettere proporzionali tra loro ed hanno le così dette "serifs", che sono delle piccole decorazioni, quali linee, alle estremità delle singole lettere. Esempi di serif fonts sono il Times, Garamond.
I "Sans Serif Fonts"
sono anche loro proporzionali, ma non hanno decorazioni delle lettere. Esempi
sono Verdana, Arial.
Ecco un esempio:
<html>
<head>
<style type = "text/css">
p { font-family: Verdana, Arial, 'Times New Roman', serif }
</style>
</head>
<body>
<p> Questa pagina è stata scritta con il carattere predefinito, ma ti appare come se fosse in Verdana e questo grazie al foglio di stile. </p>
</body>
</html>
|
Lo Stile del Font
Al font prescelto può anche essere assegnato uno stile con l'elemento font-style. Questo elemento ha tre possibili valori:
- normal (normale)
- italic (corsivo)
- oblique (corsivo più accentuato)
Vediamo nell'esempio i tre valori applicati a tre titoli:
<head>
<style type = "text/css">
p { font-style:italic }
h1 { font-style:normal }
h2 { font-style:oblique }
</style>
</head>
<body>
<p> Questa riga ti appare come fosse scritta in corsivo </p>
<h1> Questo titolo ti appare scritto in carattere normale </h1>
<h2> Quest'altro titolo ti appare scritto in obliquo </h2>
| |
| Indice Guida 
| Pagina << 3 >> 
