advanced code snippet search

We Recommend

CSS: The Definitive Guide CSS: The Definitive Guide
Provides you with a comprehensive guide to CSS implementation, along with a thorough review of all aspects of CSS 2.1. Updated to cover Internet Explorer 7, Microsoft's vastly improved browser, this new edition includes content on positioning, text wrapping (nowrap), lists and generated content, table layout, user interface, paged media, and more.

Posted By

valcartei on 09/11/07


Tagged

menu layout


Versions (?)


Who likes this?

2 people have marked this snippet as a favorite

SpinZ
vali29


highlight selected item in menu CSS only

Published in: CSS 

give a class name to each link according to the page it redirects to. give attribute id to the body of the template and make the attribute editable (Dreamweaver lets you do that: select the attrib, Modify>Templates>Make attribute editable and tick the checkbox. For each page change id value to be the same as the class of the link referring to the page. (to do that, go to Modify>Template properties)

Plain TextExpand 
  1. #home  #menu  .home a,
  2. #about #menu  .about a,
  3. #services #menu  .services a,
  4. #products #menu  .products a{ color:#000000; text-decoration:underline;}
  5.  
  6. html example code for page "about":
  7. <body id="about">
  8. ...
  9. <ul id="menu">
  10. <li class="about"><a href="../about/index.html">About</a></li>
  11. <li class="services"><a href="../services/index.html">Services</a></li>
  12. <li class="projects"><a href="../projects/index.html">Projects</a></li>
  13. </ul>

Report this snippet 

You need to login to post a comment.