Un botó amb colors degradats amb CSS3

Hacker

Ací un truquet per tenir botons, estil bootstrap, amb CSS3, on podem fer degradats entre dos colors i tenir un borde distint.

El botonet seria:

I afegiriem un exemple d'estil per als degratats de la següent manera:

.button{
border: solid 1px #da7c0c;
background: #f47c20;
background: -webkit-gradient(linear, left top, left bottom, from(#91dc5a), to(#32a1ca));
background: -moz-linear-gradient(top, #91dc5a, #32a1ca);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#91dc5a', endColorstr='#32a1ca');
color: #fff;
padding: 7px 12px;
-webkit-border-radius:4px;
-moz-border-radius:4px;
border-radius:4px;
float: right;
cursor: pointer;
}

.button:hover{
background: #f47c20;
background: -webkit-gradient(linear, left top, left bottom, from(#91dc5a), to(#32a1ca));
background: -moz-linear-gradient(top, #91dc5a, #32a1ca);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#91dc5a', endColorstr='#32a1ca');
}

Doncs bé això és tot, espere que trobes útil aquest article i que et motive a compartir els teus trucs, els teus coneixements i els teus experiments amb el Programari Lliure. Pensa-ho, va, que la Comunitat del Programari Lliure va creixent gràcies a la documentació, el disseny, la formació o la programació, sigues part de la Comunitat :-)

La cultura i la lliure circulació de les idees és l'arma més efectiva contra les dictadures del pensament i contra la ignorància.

Utilitats

NAVEGACIÓ SENSE RATOLÍ

- Tab següent enllaç.
- Shift+Tab anterior enllaç.
- Enter activa l'enllaç.
- Alt+esquerra anar arrere.

CONTRAST DE COLORS

Accessibilitat - Color Negre
Accessibilitat - Color Groc
Accessibilitat - Color Verd

Accessibilitat - Color Blau
Accessibilitat - Color Crema
Accessibilitat - Color Blanc

 

PORTADES ALTERNATIVES