Show Output
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>CSS Smooth Animation of Element's Text Color</title> <style> a { margin: 20px; -webkit-transition: color 1s; /* For Safari 3.0 to 6.0 */ transition: color 1s; /* For modern browsers */ } a:hover { color: #ff0000; } </style> </head> <body> <h1><a href="#">Hover on me</a></h1> </body> </html>