CSS, Links II

Here's a simpler way to create different coloured links on a web page. This is perfect for sites like mine where 'links' are stored on a database and used randomly in different places requiring different colors or formatting 'on-the-fly'.

Sample CSS code

code:
<style type="text/css">
<!--
div.RedLink { background-color:transparent;
              color:black; font-size:12px }
.RedLink a:link	{ color:red; text-decoration:none }
.RedLink a:visited { color:maroon; text-decoration:none }
.RedLink a:hover { color:red; text-decoration:underline }
-->
</style>

Now all you have to add into your web page and HTML to see the difference is:

code:
<div>
  <ul>
    <li><a href="http://www.example.com">Example 1</a></li>
    <li><a href="http://www.example.com">Example 2</a></li>
    <li><a href="http://www.example.com">Example 3</a></li>
  </ul>
</div>
<div class="RedLink">
  <ul>
    <li><a href="http://www.example.com">Example 1</a></li>
    <li><a href="http://www.example.com">Example 2</a></li>
    <li><a href="http://www.example.com">Example 3</a></li>
  </ul>
</div>

... and you get?

How cool is that?

TOP

Do you find it easy to navigate through this site?

 Yes

 No

 Where am I?