按钮样式

第一种：

.btn
{
/* force height to include the border and padding */
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box; /* dimensions */
margin: 0;
height: 2.1em;
padding: 0 .6em; /* text & cursor */
font-size: 18px; /* normalize */
white-space: nowrap;
cursor: pointer;
}

.btn-bg
{
background-color: #f5f5f5;
background-image: -moz-linear-gradient(top, #FFDC8A, #FEB02A);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#FFDC8A), to(#FEB02A));
background-image: -webkit-linear-gradient(top, #FFDC8A, #FEB02A);
background-image: -o-linear-gradient(top, #FFDC8A, #FEB02A);
background-image: linear-gradient(to bottom, #FFDC8A, #FEB02A);
background-repeat: repeat-x;
border-color: #FEB02A #FEB02A #bfbfbf;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
color: #0A7AC8;
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}

第二种：

.btn
{
color: #606060;
border: solid 1px #b7b7b7;
background: #ECF4FF;
background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
background: -moz-linear-gradient(top, #fff, #ededed);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
}
.btn:hover
{
background: #ededed;
background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dcdcdc));
background: -moz-linear-gradient(top, #fff, #dcdcdc);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc');
}
.btn:active
{
color: #999;
background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#fff));
background: -moz-linear-gradient(top, #ededed, #fff);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff');
}

.size1btn
{
display: inline-block;
zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
display: inline;
vertical-align: baseline;
margin: 0 2px;
outline: none;
cursor: pointer;
text-align: center;
text-decoration: none;
font: 18px/100% Arial, Helvetica, sans-serif;
padding: .5em .8em .55em;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
-webkit-border-radius: .2em;
-moz-border-radius: .2em;
border-radius: .2em;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
box-shadow: 0 1px 2px rgba(0,0,0,.2);
}