The Subtleties of CSS3 Transitions

It’s very simple. You hover over the link, and the font-size animates (or transitions) from 40px to 100px. You hover off the link, and it transitions from 100px down to 40px.

Now let’s try it like this:

a:link, a:visited {
font-size: 40px;
}

a:hover {
font-size: 100px;
-webkit-transition: font-size 1s ease;
-moz-transition: font-size 1s ease;
-ms-transition: font-size 1s ease;
o-transition: font-size 1s ease;
transition: font-size 1s ease;
}