CSS3 transition effect to background-color Examples

First Page

<!DOCTYPE html>
<html>
   <head>
      <title>CSS3 transition effect to background-color Examples</title>
      <style type="text/css">
         button {
            color: #ccc;
            border: none;
            padding: 10px 20px;
            font: bold 18px sans-serif;
            background: red;
            -webkit-transition: background 2s; 
            transition: background 2s; 
         }
         button:hover {
            background: yellow;
         }
      </style>
   </head>
   <body>
      <button type="button">Hover on me</button>
   </body>
</html>

Output

First Page