Like Us Like Us Facebook Subscribe Subscribe us YouTube Whatsapp Share us Whatsapp Query Send your queries

Simple Link Hover Effect using CSS Tutorial

Simple Link Hover Effect using CSS Tutorial

Are you bored with custom link colors and want to give a  new look to your links with new colors and effect then you come to right place, in this tutorial I am going to share how to make a link hover effect.
Simple Link Hover Effect using CSSStructure :
you have to place this simple Code in you HTML <head> tag. just like

<head>
<style type=”text/css”>
a:link{color: #370;}
a:visited {color:#369;}
a:hover   {color:#f90;}
a:active  {color:#444;}</style>
</head>



A complete Example :

<!DOCTYPE html>
<html lang=”en”>
<head>
<title>Link Hover Effect by HTML5Planet</title>
<meta charset=”utf-8″ />
<style type=”text/css”>
a:link{color: #370;font-family:arial;text-decoration:none}
a:visited {color:#369;}
a:hover   {color:#f90;font-family:Times New Roman;font-weight:bold;text-decoration:underline}
a:active  {color:#444;}
</style></head>
<body>
<a href=”http://www.codentricks.com” title=””>Codentricks</a>
|<a href=”http://www.openplus.in/” title=””>Openplus</a>
</body>
</html>

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Do you have any Query / Suggestion