Question

我正在使用WPML包提供的CSS菜单。

我希望活动的主菜单项在活动时保持蓝色。

我过去所做的是将颜色应用于.li selected_page

问题是所有子菜单项都应用了这个标签，这意味着在大多数浏览器中（奇怪的是不是当前的firefox），只要它处于活动状态，包括子菜单项在内的所有菜单项都是蓝色的。 / p>

有没有人看到将蓝色应用于活动主菜单项的方法，以便在单击时保持蓝色？谢谢！

-EDIT-在所有帮助之后：通常解决方案是你所有帮助的总和:)我最终通过使用以下代码来实现：

#menu-wrap li.selected_page a { color: #1983AF; } 
#menu-wrap ul li.selected_page ul>li>a { color: #000; }
#menu-wrap ul li.selected_page ul>li>a:hover { color: #1983AF};

Answer 1

试试“＆gt;” CSS选择器，类似“＃cms-nav-top-menu＆gt; li.selected_page {color：blue;}”

但是，这在旧浏览器中不起作用。

请参阅http://net.tutsplus.com/tutorials/html-css-techniques/the-30-css-selectors-you-must-memorize/

Answer 2

li.selected_page a:first-child
{
    color:#1983AF;
}

CSS2

Answer 3

我认为问题在于继承 - 你的风格

#menu-wrap li.selected_page {
    color: #1983AF;
}

被

覆盖

#menu-wrap ul a {
    color: #333333;
}

尝试将第一个示例更新为：

#menu-wrap ul li.selected_page a {
    color: #1983AF;
}

这应该强制它在CSS中占优势。希望这可以帮助！祝你好运。

基于评论的编辑：

要使子项不显示为蓝色，请添加此项 - 将＃000更改为您希望的任何颜色：

#menu-wrap ul li.selected_page a ul a {
    color: #000;
}

如果您想为所选子项设置不同的颜色，只需将颜色添加到此选择器（已在样式表中）：

#menu-wrap li.selected_subpage

祝你好运！

css菜单 - 活动的主菜单项

3 个答案: