0

This is probably a stupid question but I'll chance it anyways...

I've got something like...

<link rel='next' title='a title!' href='http://alink.com' /> 

I'm wondering is it possible for me to style all link rel's with 'next' in an external stylesheet?

1
  • And where would you like to see the result of the styling? element link doesn't render anything. Do you perhaps mean the anchor tag a?
    – Bazzz
    Jan 10, 2011 at 13:05

4 Answers 4

5

Are you sure you're using link right? See the spec here. A <link> tag is only specified in the head of the document and isn't rendered. You might be thinking of anchor (<a/>) tags.

You can specify a CSS attribute selector:

a[rel=next] { color: blue; }

Since IE6 doesn't support the attribute selector, you have a couple of options for complete compatibility. You could just hand code the class of the anchor or use JavaScript.

Here's a JavaScript solution using jQuery (similar syntax), but it's probably not the most ideal for just IE6 and below:

$("a[rel=next]").addClass("myRelClass");
2
  • What browsers will this NOT work in? I am assuming IE6 will fail hard. Awesome to know though, I didn't know the existence of that selector.
    – theorise
    Jan 10, 2011 at 13:09
  • According to quirksmode.org/css/contents.html, it's IE5.5 and IE6. The rest seem compatible Jan 10, 2011 at 13:12
2

I think what you mean is an anchor tag, not a link tag. And if so, then you can use the following CSS

a[rel='next'] { color: red; }
a[rel='prev'] { color: green; }

to style

<a rel='next' title='a title!' href='http://alink.com' >Next</a>
<a rel='prev' title='a title!' href='http://alink.com' >Previous</a> 

Example here.

0

In regular webbrowsers this <link> doesn't have any visible representation, so how could you style it?

0

Just use something like the following in your external CSS file...

link[rel=next] {
   color: red;
}

BTW: You probably mean the HTML-tag <a> e.g. <a href="http://domain.tld">Link</a>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.