How to make button with icon from image

In this code iwill be share with you how to make button with icon from image, we use CSS background: url() property with <a> & <button>

 <style>
  button.fa-img.gmail {
    background: url(https://ssl.gstatic.com/ui/v1/icons/mail/rfr/logo_gmail_lockup_default_1x_rtl_r2.png);
    width: 76px;
    height: 30px;
}
button.fa-img.gmail {
    background-size: cover;
    background-position-x: 30px;
    border-radius: 6px;
   border: 0;
    box-shadow: 0 0 1px 0;
    margin: 0 5px;
    padding: 0px;
    transition: 0.5s;
    outline: 0;
    cursor: pointer;
}
  
  
</style>

<a href="#"> <button class="fa-img gmail"></button></a>

 <style>
  button.fa-img.gmail {
    background: url(https://ssl.gstatic.com/ui/v1/icons/mail/rfr/logo_gmail_lockup_default_1x_rtl_r2.png);
    width: 76px;
    height: 30px;
}
button.fa-img.gmail {
    background-size: cover;
    background-position-x: 30px;
    border-radius: 6px;
   border: 0;
    box-shadow: 0 0 1px 0;
    margin: 0 5px;
    padding: 0px;
    transition: 0.5s;
    outline: 0;
    cursor: pointer;
}
  
  
</style>

<a href="#"> <button class="fa-img gmail"></button></a>

☷✎

How to make button with icon from image

Comments

Post a Comment

Meta keywords generator tool for Blogger

Custom permalink creator for blogger

Create direct download link for google drive file online

blogger meta description generator

Create simple recent post with thumbnail in blogger

How to make button with icon from image

Related

Comments

Post a Comment