HTML Element Style How to - Hover to change background

Question

We would like to know how to hover to change background.

Answer


<!DOCTYPE html>
<html lang="en">
<head>
<title>Example of setting link styles</title>
<style type="text/css">
a {<!--from w  w  w .  j a  va  2 s  .  c om-->
  width: 200px;
  padding: 5px;
  color: #ffffff;
  font-size: 18px;
  background: #5287a6;
  display: block;
  text-align: center;
  font-weight: bold;
  text-decoration: none;
}

a:hover {
  background: #36596d;
}
</style>
</head>
<body>
  <p>
    <a href="http://www.java2s.com/" target="_top">Tutorial java2s.com</a>
  </p>
</body>
</html>

The code above is rendered as follows: