In the example below underlining is turned off for all links.
The A:hover tells the browser that when the mouse is over a link the underline should appear.
The hover option only works on MSIE 4+.
(But it does not cause an error on Netscape if you include it - the effect just does not appear.).
<html>
<head>
<title>This is my page</title>
<style type="text/css">
<!--
A:link {text-decoration: none}
A:visited {text-decoration: none}
A:active {text-decoration: none}
A:hover {text-decoration: underline}
-->
</style>
</head>
<body>
Welcome to my world!<br>
<a href="http://viraj-workstuff.blogspot.com/">This Link To My Blog has no underline</a>
</body>
</html>
If you want to turn off the effect for just a single link, add a style property to the <a href> tag:
<a href="http://viraj-workstuff.blogspot.com/" style="text-decoration: none">Go to my blog</a>
You can make multiple style settings instead of just removing the underline.
<html>
<head>
<title>This is my page</title>
<STYLE TYPE="text/css"><!--
A.set1:link {color: #FF00FF; }
A.set1:active {color: #FFFF00; }
A.set1:visited {color: #00FFFF; }
A.set2:link {color: #AA00FF; background: FF00AA; text-decoration: none}
A.set2:active {color: #FF00AA; background: none transparent;}
A.set2:visited {color: #FFFF00; text-decoration: none}
--></STYLE>
</head>
<body>
Welcome to my world!<br>
<a href="http://viraj-workstuff.blogspot.com/" CLASS=set1> My Blog </a>
<a href="http://www.blogger.com/profile/10381021" CLASS=set2> My Profile </a>
</body>
</html>
No comments:
Post a Comment