Proprietà dei bordi
I bordi possono esser definiti da tre proprietà:
- border-width: <dimensione>;
- border-color: <colore>;
- border-style: <stile>;
che vengono applicati a tutti i bordi del box.
<Dimensione> può essere una lunghezza come definitita in questo articolo oppure i valori
- thin (sottile)
- medium (medio)
- thick (spesso)
<Stile> può essere:
- none (nessuno)
- solid (continuo)
- double (doppio)
- dashed (tratteggiato)
- dotted (punteggiato)
- inset (incassato)
- outset (in rilievo)
- groove (scanalato [in basso])
- ridge (scanalato [in alto])
<Colore> infine può definito come indicato in questo articolo.
Esiste anche una forma compatta:
border: <dimensione> <colore> <style>.
Utilizzando tali proprietà assegnamo le caratteristiche a tutti e 4 i lati:
Es: border: 4px red solid;
crea un bordo uniforme di 4 pixel di colore rosso. Se volessimo assegnare lo stesso bordo solo a quello inferiore potremmo usare la notazione:
border-bottom: 4px red solid;
E’ possibile inolte assegnare proprietà diverse nel seguente modo:
border-width: 1px 2px 3px 4px;
che son riferiti, rispettivamente al bordo superiore, destro, inferiore e sinistro.
Es. pratici:
Script che consente di creare in forma visuale i bordi voluti.