<html>
<head>
<title>Untitled</title>
<style type="text/css">
<!--
/* This makes all links in your page black. At onmouseover they color white with a black background */
a:link {
color:#000000;
text-decoration:underline;
}
a:visited {
color:#000000;
text-decoration:underline;
}
a:hover {
background:#000000;
color:#ffffff;
text-decoration:none;
}
a:active {
background:#000000;
color:#ffffff;
text-decoration:none;
}
/* This makes all links in he DIV with the class="orange" orange. Not because of the classname but because of the hex code in the style.. At onmouseover they turn in a sort of purple with an orange background. */
.orange a:link {
color:#ff6600;
text-decoration:underline;
}
.orange a:visited {
color:#ff6600;
text-decoration:underline;
}
.orange a:hover {
background:#ff6600;
color:#9933cc;
text-decoration:none;
}
.orange a:active {
background:#ff6600;
color:#9933cc;
text-decoration:none;
}
/* The link in the paragraph with the class gray will always be gray and not underlined. */
.hidden a:link, .hidden a:visited, .hidden a:hover, .hidden a:active {
background:none;
color:#cccccc;
text-decoration:none;
}
-->
</style>
</head>
<body bgcolor="#ffffff">
<a href="#">This is a black link</a><br><br><br>
<div class="orange"><a href="#">This link is orange</a></div><br><br><br>
<p class="hidden"><a href="#">This link in this paragraph is always gray and not underlined</a></p><br><br><br>
Basic stuff, but confusing enough, I think.. just play with it..
</body>
</html>