Advanced Search

CSS Link Background Transition

/ Published in: CSS
Save to your folder(s)
If you hover the mouse over the link the background color will smoothly change from light blue to dark blue and the font color – from black to white.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. a.foo {
  2.     padding: 5px 10px;
  3.     background: #69f;
  4.     color: #000;
  5.     -webkit-transition-property: background;
  6.     -webkit-transition-duration: 0.5s;
  7.     -webkit-transition-timing-function: ease;
  8. }
  9. a.foo:hover {
  10.     background: #33f;
  11.     color: #fff;
  12. }

URL: http://www.paultrani.com

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.