Using Font Awesome

by bvotcode

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  </head>

  <body>

    <center>
      <abutton href="www.abc.com">
       <span>  <i class="fa fa-check-circle fa-1.5x" aria-hidden="true"> </i>
         <span>  Name A</span> </span>
        
      </abutton>
      <abutton href="www.xyz.com">
        <i class="fa fa-check-circle fa-1.5x" aria-hidden="true">
          <span> Name B</span>
        </i>
      </abutton>
    </center>
  </body>

</html>

CSS

abutton .fa{
   color:blue;
 }
 
 abutton span{
   color:green;
 }
 
 abutton .fa:active,
 abutton .fa:focus,
 abutton .fa:hover{
   color:red;
 }
 abutton span:active,
 abutton span:focus,
 abutton span:hover {
  color: red;
}
abutton:visited {
  color: yellow;
}