tipo di carattere
font-family: XXX, "YY YY", famigliafont
al caricamento della pagina il browser caricherà il font XXX, se non riesce passerà al YY YY (se il font é composto da più parole va messo tra ""), ecc..
se alla fine non trova nessun carattere allora ne cercherà uno nella famiglia indicata
famiglie di caratteri:
- serif (Times New Roman)
- sans-serif (arial)
- cursive (Comic Sans)
- fantasy (Allegro BT)
- monospace (Courier)
esempio:
font-family: arial, courier,"Times New Roman", sans-serif
(vedi anche la @rules font-face)
spessore testo
font-weight:
- normal normale (serve per far tornare normale un carattere)
- bolder relativo, dice che deve essere più spesso rispetto al testo dell'elemento parente
- parole chiave: extra-light, demi-light, light, medium, bold grassetto, demi-bold, extra-bold
- valori numerici: da 100 a 900
forma testo
font-style:
- normal normale (serve per far tornare normale un carattere)
- italic corsivo
- oblique obliquo
decorazione testo
text-decoration:
- none nessuna decorazione / togli sottolineatura
- underline mette sottolineatura sotto
- overline mette una riga sopra il testo
- line-through mette riga attraverso il testo (testo cancellato)
- blink testo lampeggiante
- inherit la proprietà text-decoration resta quella dell'elemento genitore, non viene sovrascritta
colori carattere
color:
- colore in base alla normale sintassi del colore
- initial setta il colore iniziale non in base all'elemento gentiore o contenente
esempio: setto i div con il colore rosso, ma gli h1 avranno il colore del testo iniziale
div {color: red;}
h1 {color: initial;}
- inherit il colore resta quello dell'elemento genitore, non viene ereditato
esempio: gli elementi span dentro extra ereditano tutte le proprietà di extra tranne il colore che resta quello origianle di span
span {color: blue;}
.extra span {color: inherit;}
sfondo testo (evidenziare)
background-color: indicare il colore secondo la sintassi del colore
dimensiona carattere
font-size:
- in unità di misura
- in percentuale
- parole chiave: xx-small, x-small, small, medium, large, x-large, xx-large
- parole chiave: smaller, larger
allineamento
l'allineamento del testo nella sezione paragrafo
word-wrap: divide la parola lunga su due righe
- normal non divide le parole
- break-word permette la divisione delle parole
- initial l'impostazione del testo sarà quella iniziale non dell'elemento genitore o contenente
- inherit l'impostazione del testo resta quella dell'elemento genitore, non viene sovrascritta
MAIUSCOLE - minuscole
text-transform: trasforma il testo
- none testo normale
- capitalize rende maiuscola solo la prima lettera di ogni parola
- uppercase rende maiuscole tutte le lettere dell'elemento
- lowercase rende minuscole tutte le lettere dell'elemento
spaziatura
- line-height: interlinea
valore espresso in:
- normal normale
- valore numerico tipo 1.2, 1.3, 1.5, l'altezza della riga sarà uguale alla dimensione del font moltiplicata per questo valore
- unità di misura
- percentuale percentuale della dimensione del font
- letter-spacing: distanza tra le singole lettere all'interno di un documento
valore espresso in:
- normal normale
- in unità di misura
- text-indent: quantità di spazio in unità di misura aggiunta immediatamente prima della prima parola
- world-spacing: aggiungo maggiore spazio
valore espresso in:
- normal normale
- in unità di misura