'padding'
Valore: [ <length> | <percentage> ]{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…
Esempio:
P { padding: 2px 4px; }

'border-top-width'
Valore: thin | medium | thick | <length>
Default: 'medium'
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: Definisce la dimensione del bordo superiore
Esempio:
P { border-top-width: 3px }

'border-right-width'
Valore: thin | medium | thick | <length>
Default: 'medium'
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: Definisce la dimensione del bordo destro
Esempio:
P { border-right-width: 3px }

'border-bottom-width'
Valore: thin | medium | thick | <length>
Default: 'medium'
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: Definisce la dimensione del bordo inferiore
Esempio:
P { border-bottom-width: 3px }

'border-left-width'
Valore: thin | medium | thick | <length>
Default: 'medium'
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: Definisce la dimensione del bordo sinistro
Esempio:
P { border-left-width: 3px }

'border-width'
Valore: [thin | medium | thick | <length>]{1,4}
Default: non definito per le scorciatoie
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: Scorciatoia... Come negli altri casi in cui ci possono essere 4 valori (per i 4 bordi), l’interpretazione da dare è la seguente:
· 1 valore: i 4 bordi avranno quel valore;
· 2 valori: sopra e sotto come il primo valore, destra e sinistra come il secondo;
· 3 valori: sopra come il primo, destra come il secondo, sotto come il terzo; il valore non definito (sinitra) sarà identico al suo dirimpettaio: destra=sinistra;
· 4 valori: rispettivamente sopra, destra, sotto, sinitra.
Esempio:
P { border-width: 1px }
P { border-width: 1px 2px }
P { border-width: 1px 2px 3px }

'border-color'
Valore: <color>{1,4}
Default: quello della proprietà 'color'
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: definisce il colore dei 4 bordi con la stessa logica con cui border-width definisce il loro spessore: accetta, infatti, da 1 a 4 valori.
Esempio:
P { color: red; background: white; border: solid }

'border-style'
Valore: none | dotted | dashed | solid | double | groove | ridge | inset | outset
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
Note: definisce lo stile dei 4 bordi, può avere da 1 a 4 valori. Il valore di default è none. Lo stile double definisce una linea doppia il cui spessore totale (linea+spazio+linea) è, se possibile, quello definito in border-width.
Esempio:
P { border-style: solid double }
In the above example, the horizontal borders will be 'solid' and the vertical borders will be 'dotted'.
Since the Default Valore of the border styles is 'none', no borders will be visible unless the border style is set.

'border-top'
Valore: <border-top-width> || <border-style> || <color>
Default: non definito per le scorciatoie
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: una scorciatoia per definire spessore stile e colore del bordo superiore di un elemento. Se, ad esempio, il colore non viene definito, il colore del bordo sarà lo stesso assegnato all’elemento.
Esempio:
H1 { border-top: 3px solid red }

'border-right'
Valore: <border-right-width> || <border-style> || <color>
Default: non definito per le scorciatoie
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: come border-top

'border-bottom'
Valore: <border-bottom-width> || <border-style> || <color>
Default: non definito per le scorciatoie
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: come border-top

'border-left'
Valore: <border-left-width> || <border-style> || <color>
Default: non definito per le scorciatoie
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: come border-top

'border'
Valore: <border-width> || <border-style> || <color>
Default: non definito per le scorciatoie
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: è una scorciatoia per assegnare il medesimo spessore, colore e stile a tutti e quattro i bordi.
Esempio:
P { border: 2px solid black }

'width'
Valore: <length> | <percentage> | auto
Default: auto
Si applica a: elementi block-level (

)
Ereditato: no
Valori percentuali riferiti a: refer to parent element's width
Compatibilità: IE 5.0, 5.5, 6.0, NN 4.x, 6.0, Opera 5.0
Note: Se applicato alle immagini ed height=’auto’, l’immagine ridimensionata manterrà le proporzioni originali.
Esempio:
IMG.preview { width: 25% }

'height'
Valore: <length> | auto
Default: auto
Si applica a: elementi block-level (

)
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: come ‘width’

'float'
Valore: left | right | 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
Note: il valore di default è none. Se il valore è left l’elemento viene spostato a sinistra e, di conseguenza, il testo viene spostato alla sua destra.
Esempio:
IMG.preview { float: left }

'clear'
Valore: none | left | right | both
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
Note: specifica su quali lati vengono accettati elementi ‘float’.
Esempio:
H1 { clear: right }

'display'
Valore: block | inline | list-item | none
Default: block
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: questa proprietà definisce se e come un elemento viene visualizzato (sul monitor, sulla stampante…).
‘block’: l’elemento verrà gestito come un nuovo box (un riquadro, con tutte le proprietà che ne derivano), come avviene per il tag

.
‘inline’: l’elemento verrà gestito in un box inline allo stesso livello del precedente, sarà quindi dimensionato di conseguenza.
‘none’: l’elemento non verrà visualizzato, e nemmeno quelli in esso contenuti.
Esempio che rende invisibili tutte le immagini contenute:
IMG { display: none }

'white-space'
Valore: normal | pre | nowrap
Default: normal
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: definisce la modalità di gestione degli spazi (da barra-spaziatrice).
‘normal’: quella di default;
‘pre’: per il testo preformattato, vengono inseriti tanti spazi quanti quelli presenti nel codice;
‘nowrap’: si va’ a capo solo dove c’è il

Esempio:
PRE { white-space: pre }
P { white-space: nowrap }

'list-style-type'
Valore: disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none
Default: disc
Si applica a: liste e elementi che hanno la proprietà 'display'='list-item'
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: definisce lo stile del marcatore di nuova linea nelle liste ([*] …) se non è definita come marcatore un’immagine (list-style-image) o se questa immagine non può essere visualizzata.
Esempio:
OL { list-style-type: lower-alpha } risultato: a b c d ecc.
OL { list-style-type: upper-roman } risultato: I II III IV ecc.

'list-style-image'
Valore: <url> | none
Default: none
Si applica a: liste e elementi che hanno la proprietà 'display'='list-item'
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: definisce l’immagine da utilizzare come marcatore di nuova linea in una lista
UL { list-style-image: url(robycz.gif) }

'list-style-position'
Valore: inside | outside
Default: outside
Si applica a: liste e elementi che hanno la proprietà 'display'='list-item'
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: si utilizza per determinare in che modo i marcatori di inizio linea vengono allineati relativamente alla linee a livello superiore o inferiore (elenchi e sottoelenchi).

'list-style'
Valore: [disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none] || [inside | outside] || [<url> | none]
Default: non definito per le scorciatoie
Si applica a: liste e elementi che hanno la proprietà 'display'='list-item'
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: scorciatoia per list-style-type, list-style-image e list-style-position. Attenzione che il peso di ciascuna definizione deve essere attentamente valutato: maggior specificità implica maggior peso.
Esempio:
UL { list-style: url(robycz.gif) circle }