Hi,
I've just discover something interesting with css. Let assume i have a menu and with index, contacts and links items. I want the link of the current page to be different. here what i do with cascading style sheet.
| CODE | <body class="linkcontact">
<div>here a list of contact</div>
<div class="menu">
<a id="linkindex" href="index.html">Index</a><br>
<a id="linkpage" href="links.html">Links</a><br>
<a id="linkcontact" href="contacts.html">Contact</a>
</div> |
here i have defined the body class to be linkcontact, this keywords define the content of the page and could be also linkpage, or linkindex in my example.
Then i use attribute id to specify my links, to be more easy to read i reuse the same keyword as those use in the body class for each link linked to a page.
--
then in the style section
| CODE | <style type="text/css">
.linkindex #linkindex, .linkcontact #linkcontact, .linkpage #linkpage {
color: red
}
</style> |
the ".something" match any element of class something.
the "#something" match ay element of id something.
".something #somethingelse" match any element of id somethingelse enclosed by any element of class something.
Got it, the only link that will be color red will be the one which is id is used in the body class. So in my example above, only Contact will be red. to have Index in red, use
| CODE | | <body class="linkindex">...</body> |
regards,
Sébastien
|
