Jump to content

Style links but not all links


Hiker
 Share

Recommended Posts

I thought this would be easier than it's turning out to be.

I want to style a few links on a page but don't want the style to interfere with navigation links. Here's the code that I want to use but it seemed to interfere with the navbar links.

 

<style>


a:link {
  color: #616161;
}
a:visited {
  color: #616161;
}
a:hover {
  color: #8BD448;
}
a:active {
  color: #2AA8F2;
}

</style>


 


 

Link to comment
Share on other sites

Instead of passing <a> tag in css you can give the class or ID to the specific link that will be style.

And pass that selector in css.

Ex:-

Suppose you have a link like: <a href="#" class="abc">Hyperlink</a>

<a href="#" class="abc">Anchor tag</a>

<a href="#" >Navbar Link</a>

CSS would be like:

<style>


.abc:link {
  color: #616161;
}
.abc:visited {
  color: #616161;
}
.abc:hover {
  color: #8BD448;
}
.abc:active {
  color: #2AA8F2;
}

</style>

This will be styled the only link which has the class name "abc".

Hope you get it.

Thanks!

Edited by shaili_shah
  • Thanks 1
Link to comment
Share on other sites

4 hours ago, shaili_shah said:

Instead of passing <a> tag in css you can give the class or ID to the specific link that will be style.

And pass that selector in css.

Ex:-

Suppose you have a link like: <a href="#" class="abc">Hyperlink</a>

<a href="#" class="abc">Anchor tag</a>

<a href="#" >Navbar Link</a>

CSS would be like:

<style>


.abc:link {
  color: #616161;
}
.abc:visited {
  color: #616161;
}
.abc:hover {
  color: #8BD448;
}
.abc:active {
  color: #2AA8F2;
}

</style>

This will be styled the only link which has the class name "abc".

Hope you get it.

 

That worked.

At one point I was close, only a . away!

Thanks!

  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...