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=”https://www.codentricks.com” title=””>Codentricks</a>
|<a href=”http://www.openplus.in/” title=””>Openplus</a>
</body>
</html>

1
Leave a Reply

avatar
1 Comment threads
0 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
0 Comment authors
Anonymous Recent comment authors

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

  Subscribe  
newest oldest most voted
Notify of
Anonymous
Guest
Anonymous

I got this web site from my pal who informed me on the topic of this
site and now this time I am visiting this web page and reading very informative articles here.
Also visit my page diamond titanium rings

Do you have any Query / Suggestion