Hello,

I've got an HTML question. Does anyone know how to have two different link styles on the same page? E.g. some links be underlined, some not, some a different color, etc? Thanks :)

Yes, you have to use CSS. Add something like this in your HEAD area:

<style>
<!--
a.TYPE1:link { color: #FFFFFF; font-family: Arial; text-decoration: none; }
a.TYPE1:visited { color: #FFFFFF; font-family: Arial; text-decoration: none; }
a.TYPE1:hover { color: #AAAAAA; font-family: Arial; text-decoration: none; }
a.TYPE2:link { color: #FFFFFF; font-family: Arial; text-decoration: underline; }
a.TYPE2:visited { color: #FFFFFF; font-family: Arial; text-decoration: underline; }
a.TYPE2:hover { color: #AAAAAA; font-family: Arial; text-decoration: underline; }
-->
</style>

Then you specify what style you want for each link by adding the "class" attribute to the anchor tag, eg:

<a href="here.html" class="TYPE1">Click here</a>

or

<a href="here.html" class="TYPE2">Click here</a>

There's nothing special about the names TYPE1 and TYPE2, they can be anything. The above will only work on IE4+ and Netscape 4+ I think (may be IE3 as well).

Also, I'm not sure if this HTML will turn out properly when I post this message... if it doesn't, just view the page source.

Ditto to the instructions. (Use style classes)

But I'll add a warning that you better have a very good reason for breaking with the traditional user interface. If your users are confused, it's not a good site design.

Thanks, it worked. :)

Originally posted by davidsmith
...I'll add a warning that you better have a very good reason for breaking with the traditional user interface. If your users are confused, it's not a good site design.
Good point -- but color-coding groupings of links can be a very effective means of clarifying navigation, as well.

And if your users are confused, well... you know, sometimes, it's just lack of protein in their diet.