Новости Joomla

0 Пользователей и 1 Гость просматривают эту тему.
  • 1 Ответов
  • 1429 Просмотров
*

blind

  • Осваиваюсь на форуме
  • 48
  • 0 / 0
Применение стиля к меню
« : 01.04.2013, 17:09:34 »
Подскажите пожалуйста, имею два меню (скриншот), при наведении на пункт меню появляется выделение пункта, выделение с радиусным бордером по правую сторону, т.к. меню есть правое и левое, нужно сделать меню с радиусным бордером по левую сторону, собственно вопрос как??
понимаю что через суффикс меню, вроде все элементарно, но как именно, понять не могу. куда нужно добавить суффикс и как его правильно вставить в модуль.

#header ul.menu
{
   /* top:62px; */
   top:2em;
   #top:5em;
   padding: 0px 0px 0px 5px ;
   #background:#e0e0e0  url(../images/personal/ecke.gif) top left repeat-x ;
   text-align:left;
   left:0px;
   display:block;
   margin:0px 10px 0 10px;
   
}
   
#header ul.menu li
{
border:0; margin:0 !important;     
}

#header ul.menu li a:link,
#header ul.menu li a:visited
{

   color:#fff;
   #border:0 ;
   #border-right:solid 1px #ddd;
   margin:0px 0 0 0 ;
   padding:8px ;
   position:relative;
   #background: #e0e0e0 url(../images/personal/ecke.gif) repeat-x top left;
   display:block;
   padding-left:20px;

}

#header ul.menu li a:hover,
#header ul.menu li a:active,
#header ul.menu li a:focus
{
   background: url("") transparent;
   color:#000;
   #border: 1px solid #FFF;
   border-top-right-radius: 8px;
   border-bottom-right-radius: 8px;
   padding-left:20px;
   #0d4c89 ;
}

#header ul li.active a:link,
#header ul li.active a:visited
{
   color:#000;
   background:url(../images/personal/stripe_90.png);
   #border-radius: 8px;
   border-top-right-radius: 8px;
   border-bottom-right-radius: 8px;
   #text-shadow: 1px 1px 1px #000;
}

#header ul.skiplinks
{
   width:100%;
   text-align:left;
   background:none;
   z-index:20000;
   top:0;
   display:inline;
   padding:0
}

#header ul.skiplinks li a.u2:active,
#header ul.skiplinks li a.u2:focus

{
   background:#095197 !important;
   color:#fff !important;
   border:solid 1px;
   top:0 !important;
   z-index:10000;
   right:auto;
   left:0 !important;
   display:block
}  

[вложение удалено Администратором]
*

Babyaka

  • Захожу иногда
  • 110
  • 3 / 0
Re: Применение стиля к меню
« Ответ #1 : 21.04.2013, 15:27:08 »
В модуле добавляете суффикс, допустим right. В CSS файл, где прописана менюшка добавляете:

Код
#header.right ul.menu li a:hover,
#header.right ul.menu li a:active,
#header.right ul.menu li a:focus
{
   background: url("http://catalog.ru/templates/beez_20/images/personal/stripe_90.png") transparent;
   color:#000;
   #border: 1px solid #FFF;
   border-top-left-radius: 8px;
   border-bottom-left-radius: 8px;
   padding-left:20px;
   #0d4c89 ;
}

#header.right ul li.active a:link,
#header.right ul li.active a:visited
{
   color:#000;
   background:url(../images/personal/stripe_90.png);
   #border-radius: 8px;
   border-top-left-radius: 8px;
   border-bottom-left-radius: 8px;
   #text-shadow: 1px 1px 1px #000;
}
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Кликабельность псевдоэлемента в пункте меню

Автор vasilii.pupkov

Ответов: 4
Просмотров: 1633
Последний ответ 29.12.2021, 23:15:38
от v42bis
Выпадающее меню

Автор DrShepard

Ответов: 10
Просмотров: 2203
Последний ответ 20.10.2021, 12:36:16
от DrShepard
Как закруглить края выпадающего меню?

Автор coliandra

Ответов: 1
Просмотров: 834
Последний ответ 11.12.2020, 21:15:57
от effrit
При прокрутке страницы виджет залезает на меню

Автор coliandra

Ответов: 2
Просмотров: 814
Последний ответ 27.11.2020, 11:33:58
от coliandra
Как убрать маркер только из одного пункта меню.

Автор kuraev64

Ответов: 2
Просмотров: 1086
Последний ответ 20.07.2020, 11:18:44
от kuraev64