parametri separati

spessore del bordo
border-width:

• in unità di misura
• parole chiave:
  • thin bordo sottile
  • medium bordo di medio spessore
  • thick bordo di largo spessore

posizione:

• border-top-width: alto
• border-bottom-width: basso
• border-left-width: sinistra
• border-right-width: destra

stile del bordo
border-style:

• border-top-style: alto
• border-bottom-style: basso
• border-left-style: sinistra
• border-right-style: destra

tipi:

• dotted puntinato
• dashed a trattini
• solid linea unica
• double linea doppia
• groove effetto 3D
• ridge effetto 3D
• inset effetto 3D
• outset effetto 3D

colore del bordo (va indicato dopo il border-style)
border-color:

• nome indicare il nome del colore red
• esadecimale indicare il colore in esadecimale #ff0000
• RGB indicare il colore in RGB rgb(255,0,0)

posizione:

• border-top-color: alto
• border-bottom-color: basso
• border-left-color: sinistra
• border-right-color: destra

curvatura degli angoli
border-radius: unità di misura

posizione:

• border-top-left-radius: alto sinistro
• border-top-right-radius: alto destro
• border-bottom-left-radius: basso sinistro
• border-bottom-right-radius: basso destro

parametri uniti

border é possibile indicare tutti i parametri in una volta sola

sequenza:

1. border-width
2. border-style
3. border-color

esempio bordo 5px solido rosso
border:5px solid red;

posizione:

• border-top: alto
• border-bottom: basso
• border-left: sinistra
• border-right: destra

esempio bordo alto 5px solido rosso
border-top:5px solid red;