Multiple Link Colors

I have two “a” links on the same page. I would like each to have their own color set. How do I set selectors to distinguish between the two? Thanks.

There’s always a difference, but without code it’s hard to know.

What about add separate classes to them? :wink:

1 Like

Thanks. I assigned an id to one.

Hi Engine44,
Add separate classes to it is indeed the best way to do that. Better to have full control on final layout

HTML :


<a href="whatever_link_it_is.html" class="color1">CONTENT</a>  

<a href="whatever_link2_it_is.html" class="color2">CONTENT</a>

CSS :

 /* (for example)  */

.color1 {
color : fff  ;          
background-color : 000  ; 
}

.color2 {
color : rgb(214, 122, 127);           
background-color : hsla(30, 100%, 50%, .3); 
}

easy peasy!
Take care of your 44 Engine(s) :laughing:

Thanks. I did end up with separate classes and it works fine.

Just be aware that having links in different colours may confuse some users of your site, and ensure that you follow best practice for accessibility.

4 Likes