#css #menu #drupal-7 #theming
#css #меню #drupal-7 #тематизация
Вопрос:
Я создал это меню с помощью модуля superfish, и я пытался изменить цвет шрифта охлажденных меню, чтобы он отличался от цвета родительского шрифта. я пытался что-то сделать с помощью firebug и потратил больше времени на редактирование стиля css, но не смог найти точный класс цвета шрифта навигационного меню. существует класс, который называется .sf-menu.sf-style-pomegranate.sf-navbar a {
в стиле, который я использую, — pomegranate.css когда я меняю этот цвет, родительский и охлажденный цвета меняются
Демонстрация:http://users.tpg.com.au/j_birch/plugins/superfish/#sample4 стиль, который я использую
.sf-menu.sf-style-pomegranate {
float: left;
margin-bottom: 1em;
padding: 0;
}
.sf-menu.sf-style-pomegranate.sf-navbar {
width: 100%;
}
.sf-menu.sf-style-pomegranate ul {
padding-left: 0;
}
.sf-menu.sf-style-pomegranate a {
border: 1px outset #68000e;
color: #ffebee;
padding: 0.75em 1em;
white-space: nowrap;
}
.sf-menu.sf-style-pomegranate a.sf-with-ul {
padding-right: 2.25em;
}
.sf-menu.sf-style-pomegranate.rtl a.sf-with-ul {
padding-left: 2.25em;
padding-right: 1em;
}
.sf-menu.sf-style-pomegranate.sf-navbar a {
border: 0;
padding-right: 30px;
text-decoration: none;
padding-top: 5px;
}
.sf-menu.sf-style-pomegranate span.sf-description {
color: #13a;
display: block;
font-size: 0.8em;
line-height: 1.5em;
margin: 5px 0 0 5px;
padding: 0;
}
.sf-menu.sf-style-pomegranate li,
.sf-menu.sf-style-pomegranate.sf-navbar {
background-image: url(../images/topmenu.gif);
background-repeat: repeat-x;
background-color: #A60405;
text-decoration: none;
height: 30px;
}
.sf-menu.sf-style-pomegranate li li{
background: #6c0019;
}
.sf-menu.sf-style-pomegranate li li li {
background: #5f0016;
}
.sf-menu.sf-style-pomegranate li:hover,
.sf-menu.sf-style-pomegranate li.sfHover,
.sf-menu.sf-style-pomegranate li.active a,
.sf-menu.sf-style-pomegranate a:focus,
.sf-menu.sf-style-pomegranate a:hover,
.sf-menu.sf-style-pomegranate a:active,
.sf-menu.sf-style-pomegranate.sf-navbar li li {
background-image: url(../images/menu2.gif);
background-color: #E6E4E4;
background-repeat: repeat-x;
color: #C80F0F;
}
.sf-menu.sf-style-pomegranate.sf-navbar li ul {
background-image: url(../images/menu2.gif);
background-color: #E6E4E4;
background-repeat: repeat-x;
}
.sf-menu.sf-style-pomegranate.sf-navbar li ul li ul {
background-color: transparent;
}
.sf-menu.sf-style-pomegranate ul.sf-megamenu li.sf-megamenu-wrapper ol,
.sf-menu.sf-style-pomegranate ul.sf-megamenu li.sf-megamenu-wrapper ol li {
margin: 0;
padding: 0;
}
.sf-menu.sf-style-pomegranate ul.sf-megamenu li.sf-megamenu-wrapper a.menuparent {
font-weight: bold;
}
.sf-menu.sf-style-pomegranate ul.sf-megamenu li.sf-megamenu-wrapper ol li.sf-megamenu-column {
display: inline;
float: left;
width: 12em;
}
.sf-menu.sf-style-pomegranate.rtl ul.sf-megamenu li.sf-megamenu-wrapper ol li.sf-megamenu-column {
float: right;
}
.sf-menu.sf-style-pomegranate li.sf-parent-children-1 ul.sf-megamenu {
width: 12em;
}
.sf-menu.sf-style-pomegranate li.sf-parent-children-2 ul.sf-megamenu {
width: 24em;
}
.sf-menu.sf-style-pomegranate li.sf-parent-children-3 ul.sf-megamenu {
width: 36em;
}
.sf-menu.sf-style-pomegranate li.sf-parent-children-4 ul.sf-megamenu {
width: 48em;
}
.sf-menu.sf-style-pomegranate li.sf-parent-children-5 ul.sf-megamenu {
width: 60em;
}
.sf-menu.sf-style-pomegranate li.sf-parent-children-6 ul.sf-megamenu {
width: 72em;
}
.sf-menu.sf-style-pomegranate li.sf-parent-children-7 ul.sf-megamenu {
width: 84em;
}
.sf-menu.sf-style-pomegranate li.sf-parent-children-8 ul.sf-megamenu {
width: 96em;
}
.sf-menu.sf-style-pomegranate li.sf-parent-children-9 ul.sf-megamenu {
width: 108em;
}
.sf-menu.sf-style-pomegranate li.sf-parent-children-10 ul.sf-megamenu {
width: 120em;
}
Комментарии:
1. Довольно сложно оформить изображение, вы должны предоставить некоторый код. Если этот вопрос является чистым, как мне оформить этот HTML, вам следует задать его в StackOverflow, поскольку этот сайт предназначен для вопросов по Drupal, а не по CSS.
2. @googletorp Я думал, что это на drupal, и это модуль drupal.
3. @jone, практически невозможно ответить на практический CSS-вопрос, не увидев соответствующий HTML. Я бы предложил что-то вроде:
#parentMenuID li .subMenuUlClass .subMenuLiClass {...}
но, не видя вашего HTML, я не знаю, что конкретно предложить.
Ответ №1:
Не видя вашей HTML-разметки, кажется, что вы хотели бы добавить цвет к:
.sf-menu.sf-style-pomegranate li li{
background: #6c0019;
}
который стал бы:
.sf-menu.sf-style-pomegranate li li{
background: #6c0019;
color: #ff0000;
}