Comment faire un effet de biseau et de relief sur un bouton dans CSS 3 pour les navigateurs basés sur un kit Web?

Question

Comment faire un effet biseau et embosé sur le bouton Soumettre en CSS 3?

Comme ça.

Image agrandie

Je ne considère que les navigateurs basés sur Web-kit. et je ne demande pas comment donner un coin rond et comment donner un dégradé à un bouton, je demande seulement un effet de bisea

Html

<input type="submit" value="Submit your entry" class="input" />

Answer 1

Ceci est possible sans l'utilisation de balisage supplémentaire grâce à l'utilisation de plusieurs ombres en boîte:

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*/

http://jsfiddle.net/NPXfe/