在多级菜单上设计样式最后一个菜单项

我想要在其中有下拉菜单的菜单上设置风格。这就是它的样子。 >意味着它是一个下拉。在多级菜单上设计样式最后一个菜单项

首页AAA> BBB> CCC DDD联系捐赠

我试图让刚刚捐赠的选择有一个红底白字，所以我把这个在：

#main-nav li:last-child a { 
    color:#ffffff; 
    background-color:rgb(178, 45, 58); 
    border-top-right-radius: 5px; 
    border-bottom-right-radius: 5px; 
    padding: 5px; 
}

但是，这是每个下拉菜单中的最后一项也是红色！

我怎样才能使主菜单的最后一个项目被风格化？

谢谢！

来源

2015-09-25 HoustonMcDog

你能分享你的HTML标记吗？如果我们能够理解你已有的东西，它将会使这个问题更容易回答。 –

让我们看看是否有帮助： – HoustonMcDog

糟糕... @ ether这段代码显然太长了。但是我上传了它，所以可以在上看到它，并且在那里有一个图像，以便您可以看到发生了什么上面的css是我正在尝试的，当我将它改为＃main-nav> ul> li：last-child> a时，如下所示，没有应用任何css格式。 – HoustonMcDog

我要发布此，但请接受克里斯的答案，因为他是对的，但他没有对导航的正确Id名。

#navigation > ul > li:last-child > a{ 
    color:Red; 
}

这里是一个JSFiddle证明了“捐赠”是被打开red的唯一的事情。

来源

2015-09-25 18:13:07

谢谢！我非常感谢帮助！ – HoustonMcDog

您需要定位导航列表的直接子元素。使用此选择：

#main-nav > ul > li:last-child > a

来源

2015-09-25 15:14:57 Chris

实际上没有工作。现在菜单项没有改变。 – HoustonMcDog

在多级菜单上设计样式最后一个菜单项

回答

相关问题