5 replies [Last post]
tmtechnique
Offline
newbie
Last seen: 5 years 20 weeks ago
Joined: 2009-04-09
Posts: 3
Points: 0

Hi,

I have thousands of "internal site bookmarks" which appear in this format:

Internal Site Bookmark 1
Internal Site Bookmark 1
Internal Site Bookmark 1

They each have a unique ID and matching name but they do not have a class name or an href.

On the other hand, I also have regular hyperlinks throughout the site with no class names:

Hyperlink 1
Hyperlink 2
Hyperlink 3

Right now, ALL anchors on the site are set to be blue: body a {color: blue;}

However, I want the above internal site bookmarks to be black and the others to be blue.

How can I select and color the bookmark anchors differently than the hyperlinks?

Is it possible to select ONLY anchors that have an ID and name?

Is it possible to select ONLY anchors that have an ID?

Thanks for your help!

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 33 weeks 3 days ago
London
Joined: 2004-06-06
Posts: 15650
Points: 2788

That would be the point of

That would be the point of having the pseudo class :link style on the 'a' or ':link'

You could also use the attribute selector to target anchors based on the attributes they have but these wont work in IE6 and are limited in IE7

How are your internal page links targeting?

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 8 hours 19 min ago
Dallas
Timezone: GMT-5
Joined: 2004-06-25
Posts: 9174
Points: 3167

Since the link

Since the link pseudo-classes apply to "a" elements with an "href" attribute, you may do this:

a:link {
    color: red;
    }
 
a:visited {
    color: green;
    }
 
a {
    color: black;
    }
===================
 
  <p><a href="#target" >link</a></p>
  <p><a  name="target">target</a></p>

cheers,

gary

Unplanned code results in a tangled wad of brain-cramping confusion.

There are enough html & css demos and tutorials to be interesting. Please visit.

tmtechnique
Offline
newbie
Last seen: 5 years 20 weeks ago
Joined: 2009-04-09
Posts: 3
Points: 0

Hugo wrote:That would be the

Hugo wrote:

That would be the point of having the pseudo class :link style on the 'a' or ':link'

Great! Thank you! Now my bookmarks(a)are black and my hyperlinks (a:link) are blue.

But, then if I add a red colored hover style, the black bookmarks now turn red on hover

a { color: black; }
a:link { color: blue; }
a:hover { color: red; }

I would like the bookmarks to remain black on hover. I only want a:links to have a hover color of red.

Is there something obvious that I'm leaving out?

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 8 hours 19 min ago
Dallas
Timezone: GMT-5
Joined: 2004-06-25
Posts: 9174
Points: 3167

a:hover applies to all "a"

a:hover applies to all "a" elements. If you want only the links to respond, use a:link:hover, a:visited:hover {...}.

cheers,

gary

Unplanned code results in a tangled wad of brain-cramping confusion.

There are enough html & css demos and tutorials to be interesting. Please visit.

tmtechnique
Offline
newbie
Last seen: 5 years 20 weeks ago
Joined: 2009-04-09
Posts: 3
Points: 0

Oh wow this is great! Didn't

Oh wow this is great! Didn't know you could do that Smile

Thanks so much!