CSS Code
Output
<!DOCTYPE html>
<html>
<head>
<script>
function showalert() { 
    
    alert ("Button is clicked");
}
</script>
<style>
.btncls{
    background-color:#B80C4D;
    border: #2e6da4;
  	font-family: Arial, Geneva, Arial, Helvetica,  sans-serif;
	font-size: 15px;
    color: #fff;
    letter-spacing: 1px;
    padding: 8px 12px;
    font-size: 14px;
    font-weight: normal;
    
    border-radius: 4px;
    line-height: 1.5;
    text-decoration:none;
}
.btncls:disabled{
    background-color:#F780AC;
    border: #2e6da4;
  	font-family: Arial, Geneva, Arial, Helvetica,  sans-serif;
	font-size: 15px;
    color: #fff;
    letter-spacing: 1px;
    padding: 8px 12px;
    font-size: 14px;
    font-weight: normal;
    
    border-radius: 4px;
    line-height: 1.5;
    text-decoration:none;
}
</style>
</head>

<body>

<h1>HTML buttons by Custom CSS</h1>
<h3>A disabled button demo</h3>
<p>
<button class="btncls" onclick="showalert()">Next</button>
<button class="btncls" onclick="showalert()" disabled>Previous</button>
<button class="btncls" onclick="showalert()">Stop</button>
</p>
 
</body>
</html>
HTML buttons by Custom CSS
