'font-family'
Valore: [[<family-name> | <generic-family>],]* [<family-name> | <generic-family>]
Default: Definito dal browser
Si applica a: tutti gli elementi
Ereditato: si
Valori percentuali riferiti a: non supportati
Compatibilità: IE 5.0, 5.5, 6.0, NN4.x, 6.0, Opera 5.0
Note: definisce quale font utilizzare. I nomi di font contenenti spazi devono essere inseriti tra apici o virgolette
Esempio:
BODY { font-family: verdana, helvetica, sans-serif }

'font-style'
Valore: normal | italic | oblique
Default: normal
Si applica a: tutti gli elementi
Ereditato: si
Valori percentuali riferiti a: non supportati
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Esempio:
.stile { font-style: italic }

'font-variant'
Valore: normal | small-caps
Default: normal
Si applica a: tutti gli elementi
Ereditato: si
Valori percentuali riferiti a: non supportati
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: attenzione alle accentate con il maiuscoletto…
Esempio:
.maiuscoletto { font-variant: small-caps }

'font-weight'
Valore: normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
Default: normal
Si applica a: tutti gli elementi
Ereditato: si
Valori percentuali riferiti a: non supportati
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: normal=400, bold=700; bolder e lighter aumentano o diminuiscono di 100 il peso.
Esempio:
P { font-weight: normal }
.ciccio { font-weight: 700 }

'font-size'
Valore: <absolute-size> | <relative-size> | <length> | <percentage>
Default: medium
Si applica a: tutti gli elementi
Ereditato: si
Valori percentuali riferiti a: dimensione del font dell’elemento parent
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note:
<absolute-size>:[ xx-small | x-small | small | medium | large | x-large | xx-large ]
<relative-size>:[ larger | smaller ]
Esempio :
.p12 { font-size: 12; }
.ingrandisce { font-size: larger }
.unavoltaemezza { font-size: 150% }

'font'
Valore: [ <font-style> || <font-variant> || <font-weight> ]? <font-size> [ / <line-height> ]? <font-family>
Default: non definito per le scorciatoie
Si applica a: tutti gli elementi
Ereditato: si
Valori percentuali riferiti a: allowed on <font-size> and <line-height>
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Nota: scorciatoia…
Esempio:
.p12 { font: 12 sans-serif bold }

'color'
Valore: <color>
Default: Definito dal browser
Si applica a: tutti gli elementi
Ereditato: si
Valori percentuali riferiti a: non supportati
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: i valori possono essere specificati in diversi modi, vedi esempio
Esempio:
.blu { color: blue }
.blu1 { color: rgb(0,0,255) }
.blu2 { color: #0000FF }
.blu3 { color: #00F }

'background-color'
Valore: <color> | transparent
Default: transparent
Si applica a: tutti gli elementi
Ereditato: no
Valori percentuali riferiti a: non supportati
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Esempio:
.sfondobianco { background-color: #FFFFFF }

'background-image'
Valore: <url> | none
Default: none
Si applica a: tutti gli elementi
Ereditato: no
Valori percentuali riferiti a: non supportati
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Esempio:
BODY { background-image: url(robycz.gif) }
.nosfondo { background-image: none }

'background-repeat'
Valore: repeat | repeat-x | repeat-y | no-repeat
Default: repeat
Si applica a: tutti gli elementi
Ereditato: no
Valori percentuali riferiti a: non supportati
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: se viene specificata un’immagine di sfondo, si definisce la sua eventuale ripetizione
Esempio:
BODY { background: url(robycz.gif); background-repeat: repeat-x; }

'background-attachment'
Valore: scroll | fixed
Default: scroll
Si applica a: tutti gli elementi
Ereditato: no
Valori percentuali riferiti a: non supportati
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: l’immagine “scrolla” con la pagina o resta fissa…
Esempio:
BODY { background: url(robycz.gif); background-repeat: repeat-x; background-attachment: fixed; }

'background-position'
Valore: [<percentage> | <length>]{1,2} | [top | center | bottom] || [left | center | right]
Default: 0% 0%
Si applica a: block-level
Ereditato: no
Valori percentuali riferiti a: dimensione dell’elemento stesso
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: indica la posizione dell’immagine di sfondo rispetto all’elemento. Se l’immagine è fissa la posizione si riferisce alla pagina e non più all’elemento.
Esempio:
BODY { background: url(robycz.gif) center top }
BODY { background: url(robycz.gif) 50% 0% }
BODY { background-image: url(robycz.gif); background-attachment: fixed; background-position: 50% 100%; }

'background'
Valore: <background-color> || <background-image> || <background-repeat> || <background-attachment> || <background-position>
Default: non definito per le scorciatoie
Si applica a: tutti gli elementi
Ereditato: no
Valori percentuali riferiti a: supportati solo per <background-position>
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Esempio:
P { background: url(robycz.gif) gray 35% fixed }

'word-spacing'
Valore: normal | <length>
Default: normal
Si applica a: tutti gli elementi
Ereditato: si
Valori percentuali riferiti a: non supportati
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: length indica quanto dovrà essere aggiunto alla spaziatura di default (i valori possono essere negativi).
Esempio:
P { word-spacing: 2em }

'letter-spacing'
Valore: normal | <length>
Default: normal
Si applica a: tutti gli elementi
Ereditato: si
Valori percentuali riferiti a: non supportati
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: la spaziatura può essere modificata dal tipo di allineamento (giustificato).
Esempio:
P { letter-spacing: 0 }

'text-decoration'
Valore: none | [ underline || overline || line-through || blink ]
Default: none
Si applica a: tutti gli elementi
Ereditato: no
Valori percentuali riferiti a: non supportati
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
A:link, A:visited { text-decoration: overline }

'vertical-align'
Valore: baseline | sub | super | top | text-top | middle | bottom | text-bottom | <percentage>
Default: baseline
Si applica a: elementi inline
Ereditato: no
Valori percentuali riferiti: alla 'line-height' dell’elemento stesso
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: alcune proprietà fanno riferimento a “parent” (es: text-bottom allinea l’elemento con la base del font dell’elemento parent): baseline, middle, sub, super, text-top, text-bottom; altre proprietà fanno riferimento alla “linea” formattata di cui l’elemento è parte (top allinea verticalmente in alto l’elemento rispetto al più alto elemento nella linea): top, bottom.
Valori in percentuale si riferiscono al valore della proprietà line-height dell’elemento stesso.

'text-transform'
Valore: capitalize | uppercase | lowercase | none
Default: none
Si applica a: tutti gli elementi
Ereditato: si
Valori percentuali riferiti a: non supportati
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: 'capitalize': ogni parola ha la prima lettera maiuscola, 'uppercase' tutto maiuscolo, 'lowercase' tutto minuscolo, 'none' annulla il vaolre ereditato.
P { text-transform: capitalize }
TD { text-transform: uppercase }

'text-align'
Valore: left | right | center | justify
Default: Definito dal browser
Si applica a: elementi block-level (

)
Ereditato: si
Valori percentuali riferiti a: non supportati
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: L’allineamento fa riferimento all’elemento contenitore (es: la cella della tabella)
Esempio:
TD { text-align: center }

'text-indent'
Valore: <length> | <percentage>
Default: 0
Si applica a: elementi block-level (

)
Ereditato: si
Valori percentuali riferiti a: larghezza dell’elemento parent
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: il valore può essere negativo.
Esempio:
P { text-indent: 3cm }

'line-height'
Valore: normal | <number> | <length> | <percentage>
Default: normal
Si applica a: tutti gli elementi
Ereditato: si
Valori percentuali riferiti a: dimensione del font dell’elemento stesso
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: se viene specificato un numero, questo verrà moltiplicato per la dimensione del font.
Esempio: questi esempi danno lo stesso risultato
P { line-height: 140%; font-size: 10pt }
P { line-height: 1.4; font-size: 10pt }
P { line-height: 1.4em; font-size: 10pt }

'margin-top'
Valore: <length> | <percentage> | auto
Default: 0
Si applica a: tutti gli elementi
Ereditato: no
Valori percentuali riferiti a: larghezza dell’elemento contenitore
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: valore del margine alto dell’elemento
Esempio:
P { margin-top: 2 }

'margin-right'
Valore: <length> | <percentage> | auto
Default: 0
Si applica a: tutti gli elementi
Ereditato: no
Valori percentuali riferiti a: larghezza dell’elemento contenitore
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: valore del margine destro dell’elemento
Esempio:
P { margin-right: 2 }

'margin-bottom'
Valore: <length> | <percentage> | auto
Default: 0
Si applica a: tutti gli elementi
Ereditato: no
Valori percentuali riferiti a: larghezza dell’elemento contenitore
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: valore del margine basso dell’elemento
Esempio:
P { margin-bottom: 2 }

'margin-left'
Valore: <length> | <percentage> | auto
Default: 0
Si applica a: tutti gli elementi
Ereditato: no
Valori percentuali riferiti a: larghezza dell’elemento contenitore
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: valore del margine sinistro dell’elemento
Esempio:
P { margin-right: 2 }

'margin'
Valore: [ <length> | <percentage> | auto ]{1,4}
Default: non definito per le scorciatoie
Si applica a: tutti gli elementi
Ereditato: no
Valori percentuali riferiti a: larghezza dell’elemento contenitore
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: scorciatoia…
P { margin: 2px } /* tutti i margini hanno 2px */
P { margin: 2px 3px } /* sopra e sotto 2px, destra e sinistra 3px */
Queste due si equivalgono:
P { margin: 3px 1px 2px } /* sopra 3px, destra 1px, sotto 2px, sinistra 1px */
P {
margin-top: 3px;
margin-right: 1px;
margin-bottom: 2px;
margin-left: 1px;
}

'padding-top'
Valore: <length> | <percentage>
Default: 0
Si applica a: tutti gli elementi
Ereditato: no
Valori percentuali riferiti a: larghezza dell’elemento contenitore
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: dimensione del padding sul bordo superiore dell’elemento
Esempio:
TD { padding-top: 3px }

'padding-right'
Valore: <length> | <percentage>
Default: 0
Si applica a: tutti gli elementi
Ereditato: no
Valori percentuali riferiti a: larghezza dell’elemento contenitore
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: dimensione del padding sul bordo destra dell’elemento
Esempio:
TD { padding-right: 3px }

'padding-bottom'
Valore: <length> | <percentage>
Default: 0
Si applica a: tutti gli elementi
Ereditato: no
Valori percentuali riferiti a: larghezza dell’elemento contenitore
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: dimensione del padding sul bordo inferiore dell’elemento
Esempio:
TD { padding-bottom: 3px }

'padding-left'
Valore: <length> | <percentage>
Default: 0
Si applica a: tutti gli elementi
Ereditato: no
Valori percentuali riferiti a: larghezza dell’elemento contenitore
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: dimensione del padding sul bordo sinistro dell’elemento
Esempio:
TD { padding-left: 3px }