Quando ho introdotto i selettori, in questo articolo, ho fatto brevemente riferimento a proprietà e valori che, in sostanza, definiscono e caratterizzano la dichiarazione di un selettore.

Oggi volevo entrare in dettaglio di questo basilare argomento e mostrarvi quali sono i possibili tipi di valore che, in css, si possono assegnare alle proprietà.

Unità di Misura

Partiamo con il tipo di valore, di sicuro, più utilizzato nei CSS. Tale lista delle unità di misura è riferito per definire dimensioni, spazi o distanze. Anche se in pratica solo alcune di esse sono veramente usate, preferisco elencarle tutte per completezza. Si suddividono, come vedrete, in unità assolute e relative (dipendono da un riferimento).

• in (inches – pollici): misura del sistema metrico americano. Ormai non si usa praticamente per nulla essendo ingestibile come variabile relative a risoluzione e ampiezza dei monitor.
• cm (centimetri): stesso discorso visto per i pollici.
• mm (millimetri): vedi centimetri.
• pt (points – punti): unità di misura tipografica che definisce la dimensione dei font.
• pc (picas): unità usata pochissimo. 1 pica equivale a 12 punti.
• em (em-height): unità di misura relativa. 1 em equivale all’altezza media di un carattere per un dato font.
• ex (ex-height): poco usata. 1 ex equivale all’altezza del carattere x minuscolo del font scelto.
• px (pixels): unità di misura ideale su monitor. E’ quella più usata.

Unità Percentuale

Un valore espresso in percentuale è da considerare sempre relativo rispetto ad un altro valore, di solito quello definito per l’elemento padre (parente). E’ espresso con un valore numerico seguito (senza spazi) dal segno di percentuale: 80% è corretto, 80 % no.

Colori

Altro tipo di valore molto usato. Il colore, in pratica, può essere espresso in due modi : tramite parola chiave o tramite valori RGB (Red, Green,Blue).

La parola chiave, come avrete capito, identifica direttamente il colore : red,green,black,silver,grey ecc

Mentre i valori espressi in rgb specificano la quantità di rosso, verde e blu che formano il colore. In quest’ultimo caso ci sono 3 sintassi da scegliere :

• # seguito da sei cifre esadecimali (ogni cifra può assumere valori da 0 a 9 e da A a F) : #RRGGBB
• # seguito da tre cifre esadecimali : #RGB
• Operatore rgb() : richiede tre valori separati da una virgola del tipo rgb(R, G, B). I singoli valori possono essere interi da 0 a 255 oppure un valore percentuale da 0.0% a 100.0%

In sostanza, il colore verde acqua può esser rapppresentato come : aqua, #00FFFF,#0FF,rgb(0, 255, 255) oppure rgb(0, 100%, 100%).

URI

Si tratta di identificatori uniformi di risorsa, cioè di vere e proprie URL che puntano a documenti esterni (in genere immagini, come negli sfondi). Possono essere URL assoluti o relativi. In questo ultimo caso il path si riferisce sempre alla posizione del foglio di stile e non del documento HTML. La definizione dell’indirizzo è introdotta dall’operatore url() e va inserita tra parentesi tonde senza virgolette oppure con virgolette doppie o singoi apici. Ecco alcuni esempi :

• url(“http://sito/file”)
• url(‘http://sito/file’)
• url(/file)
• url(“../file”)

Unità per gli angoli

Questi valori sono associabili a due proprietà comprese nella sezione dei CSS dedicata ai dispositivi audio : azimuth e elevation. Le unità di misura queste:

• deg (degree – grado): si riferisce all’ampiezza di un angolo (es. 90deg).
• grad (gradians): si riferisce all’ampiezza di un angolo su una scala 1-400 (es. 100grad = 90deg)
• rad (radians): si riferisce all’ampiezza di un angolo su una scala 1-pi greco

Unità di tempo

Anche le unità di tempo sono utilizzate, di norma, solo negli stili audio. Infatti, vengono sfruttate per impostare la pausa tra le parole lette da un sintetizzatore vocale. Si applicano solo a queste tre proprietà: pause, pause-after, pause-before.

• s (secondi)
• ms (millisecondi)

Logicamente, esistono altri tipi di valori nei css, ma si tratta di valori molto poco sfruttati ed utlizzati e, pertanto, non ho ritenuto utile inserirli in questi elenchi.