Button hover effects

      No Comments on Button hover effects

Button hover effects in CSS using the pseudo class:hover



Button hover effects

HTML:

<div class="animate13">
<button class="btn-animate13">Hover Me  <span class="glyphicon glyphicon-menu-right" id="icon_animate13"></span></button>
</div>

CSS:

.animate13
{
  padding:4%;
  text-align:center;
}
.btn-animate13
{
  border:solid 1px #000;
  padding:7px 10px;
  color:#000;
  background-color:transparent;
  font-size:13px;
}
#icon_animate13
{
  display:none;
  transition:0.5s;
}
.btn-animate13:hover
{
  background-color:#000;
  color:#fff;
}
.btn-animate13:hover #icon_animate13
{
  display:inline;
}

Leave a Reply

Your email address will not be published. Required fields are marked *