Come personalizzare il bordo dei bottoni

 

L'esempio che di seguito vi descrivo si riferisce al caso del box connessione, ma si applica in tutti i casi di bottoni presenti nella skin.

Bene iniziamo con il dire quale è la classe che ci interessa e cioè "input bouton", lo sfondo del box è arancione, lo sfondo del bottone è viola chiaro (#E6E4F1) e il colore della scritta è nero (#000000).qui nessun bordo perchè lospessore del bottone in questione  è uguale a zero. [border : 0px solis #FFFFFFF], il colore bianco (#FFFFFF" da considerare per tutti gli altri esempi.

Come lo vedrete	Style CSS
	input.bouton, button { /* bouton */   cursor: pointer;   margin: 4px 0px;   color: #000000;   border: 0px solid #FFFFFF;   background-color: #E6E4F1;   font: 11px Arial, Helvetica, sans-serif; }

Più soluzioni sono possibili :

"con bordo"	"inserito"	"sporgente"
border: 2px solid #FFFFFF;	border: 2px inset #FFFFFF;	border: 2px outset #FFFFFF;

In questi esempi lo spessore del bordo è uguale a 2px, un poco più fino a 1px ma anche più spesso 3px.

 

Fonte: GuppYSkins

Autore : valkiro