.btn {
background: -moz-linear-gradient(top,#DFE9F5, #1D25F7 50%,#0020A3 50%,#0039FE);
background: -webkit-gradient(linear, left top, left bottom, from(#DFE9F5), color-stop(0.5,#1D25F7), color-stop(0.5,#0020A3), to(#0039FE));
color: #FFF;
font-size:16px;
border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border: 1px solid #0033FF;
-moz-box-shadow: 1px 1px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0.5);
-webkit-box-shadow: 1px 1px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0.5);
text-shadow: 0px 0px 3px rgba(0,0,0,0.5);
width: 40%;
padding: 5px 0;
}
.btn:hover{
background: -moz-linear-gradient(top,#EFF9F5, #2D35F7 50%,#1030B3 50%,#1049FE);
background: -webkit-gradient(linear, left top, left bottom, from(#EFF9F5), color-stop(0.5,#2D35F7), color-stop(0.5,#1030B3), to(#1049FE));
color: #FFF;
font-size:16px;
border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border: 1px solid #1144FF;
-moz-box-shadow: 1px 1px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0.5);
-webkit-box-shadow: 1px 1px 1px rgba(000,000,000,0.3),inset 0px 0px 3px rgba(255,255,255,0.5);
text-shadow: 0px 0px 3px rgba(0,0,0,0.5);
width: 40%;
padding: 5px 0;
}
.btn:active {
position:relative;
top:1px;
}
参考：
5つの効果で作る、よく使うCSS3ボタンデザインサンプル集
CSS Button Generator
