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

fate

  • Новичок
  • 17
  • 0 / 0
День добрый, я хочу изменить внешний вид меню в css нашел стили к этому меню, но проблема в том что если я задаю фон для тега <li> то он задается как на меню, так и на под меню (получается не красиво)
Я хотел задать стиль только для под меню, но для этого нужно найти в коде само меню, в index.php  прописано :
<jdoc:include type="modules" name="user4" style="xhtml" />
Но где найти-то само меню?
*

master_alf

  • Захожу иногда
  • 105
  • 8 / 0
Re: Измерения внешнего вида меню
« Ответ #1 : 08.07.2009, 20:56:06 »
Модуль, который отвечает за меню находится в modules\mod_mainmenu файл вывода, по идее, modules\mod_mainmenu\tmpl\default.php
Надеюсь знающие меня поправят, если я не прав.
Возможно еще и в настройках самого меню можно что-то указать...
*

voland

  • Легенда
  • 9799
  • 543 / 107
  • Эта строка съедает место на вашем мониторе
Re: Измерения внешнего вида меню
« Ответ #2 : 08.07.2009, 20:58:13 »
в css
ul li {background:картинка }
ul li ul li {background:none}
*

fate

  • Новичок
  • 17
  • 0 / 0
Re: Измерения внешнего вида меню
« Ответ #3 : 08.07.2009, 21:15:40 »
в css
ul li {background:картинка }
ul li ul li {background:none}
было бы все так просто я уже наслаждался красивым меню, но там же все так закручено что х разбереш
*

fate

  • Новичок
  • 17
  • 0 / 0
Re: Измерения внешнего вида меню
« Ответ #4 : 08.07.2009, 21:32:13 »
в css
ul li {background:картинка }
ul li ul li {background:none}
вот что у меня в файле css

/* LEFT COLUMN + RIGHT COLUMN
--------------------------------------------------------- */
#ja-col1 {
   float: left;
   width: 175px;
   overflow: hidden;
}

.wide #ja-col1 {
   width: 220px;
}

#ja-col1 div.innerpad {
   padding: 85px 7px 15px;
}

.wide #ja-col1 div.innerpad {
   padding: 85px 10px 15px; 
}

#ja-col2 {
   float: right;
   width: 24.9%;
   overflow: hidden;
   padding: 15px 0;
}

#ja-col2 div.innerpad {
   padding: 0 7px 0 0;
}

.wide #ja-col2 div.innerpad {
   padding: 0 15px 0 0;
}

#ja-col1 table,
#ja-col2 table {
   border-collapse: collapse;
   border-spacing: 0;
}

#ja-col1 ul li,
#ja-col2 ul li {
   padding-left: 10px;
   margin: 3px;
   background: url(../images/arrow.png) no-repeat 0 8px; /*--------------------------------------------*/
}

#ja-col1 ul,
#ja-col2 ul {
   margin: 3;
}


что мне изменит?
*

voland

  • Легенда
  • 9799
  • 543 / 107
  • Эта строка съедает место на вашем мониторе
Re: Измерения внешнего вида меню
« Ответ #5 : 08.07.2009, 21:33:42 »
Добавить
#ja-col1 ul li ul li,
#ja-col2 ul li  ul li {
   padding-left: по вкусу;
   margin: по вкусу;
   background: none; /*--------------------------------------------*/
}
*

fate

  • Новичок
  • 17
  • 0 / 0
Re: Измерения внешнего вида меню
« Ответ #6 : 08.07.2009, 21:40:24 »
Добавить
#ja-col1 ul li ul li,
#ja-col2 ul li  ul li {
   padding-left: по вкусу;
   margin: по вкусу;
   background: none; /*--------------------------------------------*/
}
и что это изменит? только картинка пропадет а проблеиму не ришит
*

voland

  • Легенда
  • 9799
  • 543 / 107
  • Эта строка съедает место на вашем мониторе
*

fate

  • Новичок
  • 17
  • 0 / 0
Re: Измерения внешнего вида меню
« Ответ #8 : 08.07.2009, 21:58:13 »
я прикрепил скрин меню

нужно что бы стиль пременялся только к подменю а не ко всему меню.
если я прописываю так
#ja-col1 ul li,
#ja-col2 ul li {
   padding-left: 10px;
   margin: 3px;
   background:#999999;

то этот стиль распространяется и на родительский пункт меню и на все дочернии, а нужно только что бы только на дочернии

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

voland

  • Легенда
  • 9799
  • 543 / 107
  • Эта строка съедает место на вашем мониторе
Re: Измерения внешнего вида меню
« Ответ #9 : 08.07.2009, 22:03:33 »
Думать надо, выше что написано!! И орфографию поправить
*

fate

  • Новичок
  • 17
  • 0 / 0
Re: Измерения внешнего вида меню
« Ответ #10 : 08.07.2009, 22:10:07 »
выше что написано!!
Где выше? поканичего по делу не посоветовали
*

Antosha

  • Захожу иногда
  • 420
  • 52 / 0
  • Плохо спорить плохо
Re: Измерения внешнего вида меню
« Ответ #11 : 09.07.2009, 01:57:49 »
Так тебе же выше и написали, вот дискриптор:

#ja-col2 ul li  ul li {}

Свойства - по вкусу.
<a href="http://joomlablog.ru/">JoomlaBlog</a>
*

fate

  • Новичок
  • 17
  • 0 / 0
Re: Измерения внешнего вида меню
« Ответ #12 : 09.07.2009, 09:54:48 »
Так тебе же выше и написали, вот дискриптор:

#ja-col2 ul li  ul li {}

Свойства - по вкусу.
Вы издеваетесь? ))
вопрос в том и стоит какие свойства задать что бы стиль распространялся только на под меню
*

5py0n

  • Новичок
  • 6
  • 0 / 0
  • скрывающийся во тьме
Re: Измерения внешнего вида меню
« Ответ #13 : 09.07.2009, 11:11:21 »
Если не ошибаюсь - у меня тот же вопрос: как настроить стиль отдельно для под меню.

На сайте http://minipig.ee если нажать на "Наши свинки" или "Поросята" - выпадает по 2 пункта, как для них отдельно стиль прописать?
В template.css для основных ссылок меню прописано это:

Цитировать
.right a {
       vertical-align: middle;
       text-align: center;
       text-decoration : none;
       font-family: Verdana;
       font-size: 15px;
       color: #000000;
       font-weight:bold;
}


.right a:hover {
   color : #333;
   text-decoration : none;
        border-bottom:1px solid black;
        border-top:1px solid black;
        border-left:1px solid black;
        border-right:1px solid black;
}
*

master_alf

  • Захожу иногда
  • 105
  • 8 / 0
Re: Измерения внешнего вида меню
« Ответ #14 : 09.07.2009, 13:24:04 »
5py0n, попробуй так
div#active_menu div {
/*а вот тут рисовать свойства */
}
Вообще мне очень помогла информация с сайта http://htmlbook.ru(не сочтите за рекламу), там в разделе шаг за шагом очень доступно описано как работать с css.
*

master_alf

  • Захожу иногда
  • 105
  • 8 / 0
Re: Измерения внешнего вида меню
« Ответ #15 : 09.07.2009, 13:25:49 »
Упс, не правильно на теги посмотрел. Так не сработает :(
Не могу свое сообщение удалить. Модераторы, пожалуйста, удалите?
*

chtec

  • Захожу иногда
  • 230
  • 100 / 1
Re: Измерения внешнего вида меню
« Ответ #16 : 09.07.2009, 14:09:48 »
fate, юноша, вам уже несколько раз указали, как для меню и для подменю задать отдельные стили:
в css
ul li {background:картинка }
ul li ul li {background:none}

Где какой стиль прописывать - дело ваше, но в любом случае:
ul li
{
здесь задается стиль для пунктов меню
}
ul li ul li
{
здесь - подменю
}
ul li ul li ul li
{
здесь - подменю второго уровня
}

и так далее.

5py0n
Эти ссылки у вас имеют класс .sublevel
Значит в css:
.sublevel
{
здесь настройки
}

Советую установить плагин firebug для браузера firefox - он показывает, какие классы и свойства приписаны тому или иному объекту на странице. Очень удобно.
Осень тоже хорошо.
*

5py0n

  • Новичок
  • 6
  • 0 / 0
  • скрывающийся во тьме
Re: Измерения внешнего вида меню
« Ответ #17 : 09.07.2009, 14:49:37 »
chtec

Про sublevel я додумался, не помогает это, нету изменений..
*

fate

  • Новичок
  • 17
  • 0 / 0
Re: Измерения внешнего вида меню
« Ответ #18 : 09.07.2009, 14:54:50 »
ul li
{
здесь задается стиль для пунктов меню
}
ul li ul li
{
здесь - подменю
}
ul li ul li ul li
{
здесь - подменю второго уровня
}

и так далее.
Спасибо тебе друг ))все работает )
*

fate

  • Новичок
  • 17
  • 0 / 0
Re: Измерения внешнего вида меню
« Ответ #19 : 09.07.2009, 15:19:31 »
fate, юноша, вам уже несколько раз указали, как для меню и для подменю задать отдельные стили:
а можно сделать фон ячейки в виде градиента? если я создаю картинку, а потом прописываю background: url
она у меня на фоне как-то скошено получается ((
*

master_alf

  • Захожу иногда
  • 105
  • 8 / 0
Re: Измерения внешнего вида меню
« Ответ #20 : 09.07.2009, 16:24:49 »
Про sublevel я додумался, не помогает это, нету изменений..
.sublevel это класс тега <a>, соответственно, вариантов изменения стилей под него не так уж и много - то, что относится к шрифтам. 5py0n а что конкретно ты хочешь там изменить? Фон?
*

master_alf

  • Захожу иногда
  • 105
  • 8 / 0
Re: Измерения внешнего вида меню
« Ответ #21 : 09.07.2009, 16:33:28 »
fate, можно залить ячейку картинкой. Что значит скошено? Если градиент у тебя с прозрачностью, то возникнет баг в IE.
*

5py0n

  • Новичок
  • 6
  • 0 / 0
  • скрывающийся во тьме
Re: Измерения внешнего вида меню
« Ответ #22 : 09.07.2009, 16:42:51 »
.sublevel это класс тега <a>, соответственно, вариантов изменения стилей под него не так уж и много - то, что относится к шрифтам. 5py0n а что конкретно ты хочешь там изменить? Фон?

Я просто хотел уменьшить размер шрифа подменю.
*

fate

  • Новичок
  • 17
  • 0 / 0
Re: Измерения внешнего вида меню
« Ответ #23 : 09.07.2009, 16:52:47 »
посмотрите во вложении

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

master_alf

  • Захожу иногда
  • 105
  • 8 / 0
Re: Измерения внешнего вида меню
« Ответ #24 : 09.07.2009, 17:33:04 »
5py0n, как я понял, ты пытался задать размер шрифта в 12px?
Судя по тому, что я вижу в FireBug свойства заданные для класса .submenu отменяются вот этими
template.css (line 311)
.right a {
color:#000000;
font-family:Verdana;
font-size:15px;
font-weight:bold;
text-align:center;
text-decoration:none;
vertical-align:middle;
« Последнее редактирование: 09.07.2009, 17:39:30 от master_alf »
*

master_alf

  • Захожу иногда
  • 105
  • 8 / 0
Re: Измерения внешнего вида меню
« Ответ #25 : 09.07.2009, 17:38:19 »
fate, если я правильно понял, то тебе не нравится то, что картинка начинается не с самого верха ячейки?
А сам градиент задумывался из серого тона справа в белый слева? Я бы лично сделал в высоту градиент 1 пиксель, а в ширину столько, сколько нужно для этого меню, и в css проставил background-position: top; и background-repeat: repeat-x;
Т.е. выравнивание картинки по верхней границе, и повторение картинки по оси х(по вертикали).
ИМХО должно сработать.
*

master_alf

  • Захожу иногда
  • 105
  • 8 / 0
Re: Измерения внешнего вида меню
« Ответ #26 : 09.07.2009, 17:51:47 »
5py0n, просто поставь для нужных параметров !important
т.е.
.submenu {
font-size: 12px !important;
}
и будет гуд.
*

fate

  • Новичок
  • 17
  • 0 / 0
Re: Измерения внешнего вида меню
« Ответ #27 : 09.07.2009, 17:59:42 »
fate, если я правильно понял, то тебе не нравится то, что картинка начинается не с самого верха ячейки?
А сам градиент задумывался из серого тона справа в белый слева? Я бы лично сделал в высоту градиент 1 пиксель, а в ширину столько, сколько нужно для этого меню, и в css проставил background-position: top; и background-repeat: repeat-x;
Т.е. выравнивание картинки по верхней границе, и повторение картинки по оси х(по вертикали).
ИМХО должно сработать.
Спасибо огроменное, все работает, только не по x а по y
*

5py0n

  • Новичок
  • 6
  • 0 / 0
  • скрывающийся во тьме
Re: Измерения внешнего вида меню
« Ответ #28 : 09.07.2009, 18:49:19 »
master_alf

Спасибо за подсказку. Убрал вообще .right a и .right a:hover, дописал .mainlevel, .mainlevel:hover и .sublevel, .sublevel:hover - теперь все работает =)
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Большое меню Joomla

Автор Amakeeva

Ответов: 1
Просмотров: 116
Последний ответ 22.01.2018, 13:17:45
от effrit
Как можно отображать имя пользователя в название меню?

Автор selimoff

Ответов: 27
Просмотров: 3044
Последний ответ 02.01.2018, 15:24:44
от logan-19
как сделать пункт меню не кликабельным?

Автор qweqweqwe

Ответов: 13
Просмотров: 5806
Последний ответ 07.09.2017, 01:45:49
от forzi
Сдвинуть пункты меню в левое положение

Автор wectra

Ответов: 6
Просмотров: 437
Последний ответ 12.07.2017, 21:09:01
от wectra
Не отображаются пункты в меню

Автор physic

Ответов: 16
Просмотров: 15751
Последний ответ 27.05.2017, 00:10:15
от OutLaw1