CCS Hover

a.foo {
padding: 5px 10px;
background: #9c3;
-webkit-transition-property: background;
-webkit-transition-duration: 0.3s;
-webkit-transition-timing-function: ease;
}
a.foo:hover {
background: #690;

fig 2.02: This figure shows the smooth transition of light green to darker green background.
You’ll notice the 3 parts of a transition in the declaration:
• transition-property: The property to be transitioned (in this case the background property)
• transition-duration: How long the transition should last (0.3 seconds)
• transition-timing-function: How fast the transition happens over time (ease)