Самый простой способ классифицировать элемент навигации "текущая страница"?


На моей веб-странице есть панель навигации со ссылками на разные страницы. Есть ли простой способ автоматически установить класс в элементе навигации, соответствующем текущей странице? Например, я хочу, чтобы вкладка "О нас" на панели имела другой стиль, если вы в данный момент просматриваете страницу "О нас". Я знаю, что мог бы настроить PHP для каждой страницы, но я бы предпочел более общее решение "установить и забыть".

Author: erjiang, 2010-06-04

2 answers

Я использовал это раньше, и это хорошо работает.

Http://www.cssnewbie.com/intelligent-navigation/

 3
Author: pixeltocode, 2010-06-04 13:22:50

Если вам нужно чистое решение HTML/CSS, лучшее, что я могу придумать, - это поместить класс в тело, описывающее, какая вкладка должна быть выделена, и идентификатор на каждой вкладке, а затем нацелить вкладки оттуда через CSS.

Таким образом, для HTML страница "О нас" будет иметь что-то вроде <body class="AboutUs">, в то время как страница "Главная" будет иметь аналогичное <body class="Home">. Каждая вкладка будет иметь уникальные идентификаторы, такие как "AboutUs" и "home".

Затем в CSS вы могли бы оформить его так:


body.AboutUs tabs#aboutUs,
body.Home tabs#home
{
    /* selection style goes here */
}
 3
Author: Dan M, 2010-06-04 03:45:30