css - Liferay 样式导航栏下 zipper 接

Question

我正在制作一个 Liferay 主题，但我在尝试设计导航菜单的样式时遇到了很多麻烦。我已经为那些没有像这样下拉的人改变了导航链接上的经典主题悬停功能:

.aui #navigation .nav li.open>a{
    background-color: orange;
    color: #005373;
}

这实际上工作正常。但我无法设计那些下 zipper 接的样式......试过这个:

1:

.aui #navigation .navbar-inner li:hover a.dropdown-toggle {
    background-color: red;
}

2:

.aui #navigation .navbar-inner li.open> .dropdown-toggle {
    background-color: green;
}   

3:

.aui #navigation .navbar-inner li:hover.dropdown-toggle {
    background-color: yellow;
}

4:

.aui #navigation .navbar-inner li:hover .dropdown-toggle active {
    background-color: blue;
}

Answer 1

好吧，作为部分解决方案，如果您发现自己处于相同的情况(尝试在 <a class="dropdown-toggle"> 悬停事件中为 <li> 背景着色，并且您选择从经典继承)，我可以给您的最佳建议是:

就让<a class="dropdown-toggle">元素填充 <li>元素，添加足够的填充。