Активное меню для версии phpBB3, phpBB2 и punBB

Активное меню для версии phpbb3.



Приступим:

1. Для начала зайдите в ПА-Оформление-Главная-Верхняя часть страниц & Навигация и поставьте, НЕТ на против «Показывать в панели навигации только картинки».

2. В ПА-Оформление-Управление картинками-Продвинутый режим и вместо картинок ЧаВо, Вход, Выход, Пользователи, Группы, Портал, Форум, Календарь, Поиск, Редактировать ваш профиль, Личные сообщения, Новые ЛС, Календарь (если активирован), Регистрация пропишите вот эту картинку

Код:

http://illiweb.com/fa/empty.gif

3. В ПА > Оформление > Цвета зайдите во вкладку «Каскадная таблица стилей CSS» и пропишите следующий код:

Код:

#page-header .navbar {
clear: both;
background-color: #eee;
padding: 0px 10px;
}
#page-header ul.navlinks {
padding: 0;
margin: 0;
background-color: #40b9c7;
border: none;
}
#page-header ul.linklist li {
float: left;
margin: 0;
padding: 0;
list-style-type: none;
font-size: 10px;
display: inline;
}
#page-header ul.linklist li a {
margin: 0;
padding: 0px 5px;
display: block;
font-weight: bold;
width: auto;
height: auto;
color: #b8f8ff;
}
#page-header ul.linklist li a:hover, a:focus, a:active {
background-color: #b8f8ff;
color: #40b9c7;
}


Вы можете изменять цвет по вашему усмотрению. На картинке показано какой, цвет за что отвечает:


Активное меню для версии phpBB2.

Код:

div#page-body{
margin-top:5px;
}

a.mainmenu img {
display:none;
}

a.mainmenu {
margin:0 -6px;
padding:5px;
background-color:#606060;
color:white;
text-decoration:none !important;
}

a.mainmenu:hover {
color:red;
background-color:#505050;
text-decoration:none;
}

a.mainmenu:focus {
color:blue;
text-decoration:none;
}

Активное меню для версии punBB.

Код:

#pun-navlinks li{
margin-right:-10px;
}

#pun-navlinks li a {
color:white !important; /*Цвет текста*/
background-color:#404040;  /*Цвет фона*/
margin:0;
padding:5px;
}

#pun-navlinks li a:hover {
background-color:#101010; /*Цвет фона при наведении*/
color:red; /*Цвет текста при наведении*/
}

#pun-navlinks li a img {
display:none;
}

#pun-navlinks a:hover, #pun-navlinks a:active, #pun-navlinks a:focus {
text-decoration:none;
}

#pun-navlinks li a:active {
color:orange;
}

#pun-navlinks li a:focus {
color:blue; /*Цвет текста при нажатии*/
}