21

Is it possible to apply a style to an HTML element using only its title as a unique identifier? For example:

<div class="my_class">
    <a href="some site" title="MyTitle">My Link</a>
</div>

I would like to write a rule that will apply only to link element within a div of class my_class and the link title MyTitle.

I do not have the ability to change page layout, however, I can use a custom CSS file that is included automatically.

Thank you

5 Answers 5

40

It sure is, using what's called attribute selectors; these are part of CSS2. In your particular case, you'd use:

div.my_class a[title="MyTitle"] { color: red; }

You can read more about attribute selectors here: http://www.w3.org/TR/CSS2/selector.html#attribute-selectors

Sign up to request clarification or add additional context in comments.

4 Comments

It should be noted that IE6 does not support attribute selectors
Alas, IE6 doesn't support a lot of stuff. Onwards and upwards, though! ;)
You could hack through IE6 non support using javascript. ie in jQuery: $('div.my_class a[title="MyTitle"]').css('color', 'red'); And then put it away using conditional comments and everyone will be happy.
you could do this with expressions in IE6 but that would be a pretty ugly hack
3

Yes you can:

http://www.w3.org/TR/CSS2/selector.html#attribute-selectors

You would say A[title="MyTitle] I believe.

Comments

3

What you are looking for is css attribute selectors:

http://www.w3.org/TR/CSS2/selector.html#attribute-selectors

a[title] { ... }

Comments

3

CSS specifications identify a number of "selectors" that may help you here. For example, you could apply a rule such as the following:

.my_class a[title="MyTitle"]
{
   ...
}

You can see a detailed specification of CSS "selectors" here:

http://www.w3.org/TR/2001/CR-css3-selectors-20011113/

Comments

1

Although it is possible, using attribute selectors (see http://www.w3.org/TR/CSS2/selector.html#attribute-selectors ) Internet Explorer 6 does not support it (see http://kimblim.dk/css-tests/selectors/ )

An example from the W3C site: H1[title] { color: blue; }

Comments

Your Answer

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

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.