<div id="container">
  <button>ホバーすると変化するよ！</button>
</div>
#container{
  text-align:center;
  margin-top:100px;
}

button{
  padding:10px 30px;
  background:#fff;
  border:1px solid #000;
  color:#000;
}

button:hover{
  background:#000;
  color:#fff;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.