6/01/2015

Html ,Css Button

CSS button
CSS

 /*------------------Button-------------------*/  
 .myButton {  
  -moz-box-shadow: 0px 1px 0px 0px #fff6af;  
  -webkit-box-shadow: 0px 1px 0px 0px #fff6af;  
  box-shadow: 0px 1px 0px 0px #fff6af;  
  background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffec64), color-stop(1, #ffab23));  
  background:-moz-linear-gradient(top, #ffec64 5%, #ffab23 100%);  
  background:-webkit-linear-gradient(top, #ffec64 5%, #ffab23 100%);  
  background:-o-linear-gradient(top, #ffec64 5%, #ffab23 100%);  
  background:-ms-linear-gradient(top, #ffec64 5%, #ffab23 100%);  
  background:linear-gradient(to bottom, #ffec64 5%, #ffab23 100%);  
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffec64', endColorstr='#ffab23',GradientType=0);  
  background-color:#ffec64;  
  -moz-border-radius:6px;  
  -webkit-border-radius:6px;  
  border-radius:6px;  
  border:1px solid #ffaa22;  
  display:inline-block;  
  cursor:pointer;  
  color:#333333;  
  font-family:arial;  
  font-size:11px;  
  font-weight:normal;  
  padding:4px 14px;  
  text-decoration:none;  
  text-shadow:0px 1px 0px #86ae47;  
 }  
 .myButton:hover {  
   background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffab23), color-stop(1, #ffec64));  
  background:-moz-linear-gradient(top, #ffab23 5%, #ffec64 100%);  
  background:-webkit-linear-gradient(top, #ffab23 5%, #ffec64 100%);  
  background:-o-linear-gradient(top, #ffab23 5%, #ffec64 100%);  
  background:-ms-linear-gradient(top, #ffab23 5%, #ffec64 100%);  
  background:linear-gradient(to bottom, #ffab23 5%, #ffec64 100%);  
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffab23', endColorstr='#ffec64',GradientType=0);  
  background-color:#ffab23;  
 }  
 .myButton:active {  
  position:relative;  
  top:1px;  
 }  
 /*-------------------End of button-------------------*/  

Html

 <asp:Button ID="btnUploadfile" runat="server" Text="Upload photo" CssClass="myButton" OnClick="btnUploadfile_Click" />  

No comments:

Post a Comment