Cómo hacer efecto de biselado y en relieve a ¿Enviar botón en CSS 3?¿Cómo hacer un efecto de bisel y efecto embebido en el botón CSS 3 para los navegadores basados en kits web?
Me gusta.
imagen ampliada 
sólo estoy considerando Web-kit navegadores basados. y No estoy preguntando ¿Cómo dar esquina redonda y cómo dar gradiente de botón, sólo estoy preguntando por efecto de bisel
HTML
<input type="submit" value="Submit your entry" class="input" />
Esto es posible sin el uso del margen de beneficio adicional mediante el uso de múltiples cajones-sombras:
box-shadow:
0 1px 2px #fff, /*bottom external highlight*/
0 -1px 1px #666, /*top external shadow*/
inset 0 -1px 1px rgba(0,0,0,0.5), /*bottom internal shadow*/
inset 0 1px 1px rgba(255,255,255,0.8); /*top internal highlight*/
Duopixel - +10 Awesome –
botón sexy, pero sus comentarios son incorrectos "resaltado interno superior" y "sombra interior inferior" están hacia atrás. una explicación de los 3 valores también sería útil. Estoy tratando de averiguar en qué se encuentra el 0. – mpen
Fijo, el 0 es la posición x de la sombra (relativa al elemento). http://www.css3.info/preview/box-shadow/ – Duopixel
Probablemente no sea posible sin un elemento circundante adicional, pero puedo estar equivocado. Interesado en ver qué surge. –
@pekka - si sabes cómo hacer esto posible con un elemento circundante, dime. –
Es * debería * ser posible con un elemento circundante con 'box-shadow: insertet ......', creando la sombra exterior, y un elemento interno con el degradado etc., y una 'box-shadow' normal. Sin embargo, es bastante complejo de hacer, requerirá un montón de manipulación hasta que se vea bien. –