<a href="#">ボタン<a>
a{
  display:block;
  background:#9c0;
  width:200px;
  text-align:center;
  padding:1px 0;
  text-decoration:none;
  font-weight:bold;
  color:#ddd;
  -webkit-transition: all .3s;
  transition: all .3s;
}
a:hover{
  color:#9c0;
  background:#ddd;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.