Question

我的网站上有一个基本的ASP：菜单。

我要做的是在我的下拉菜单中的最后一个元素的底部添加1px纯黑色边框。 CSS似乎没有做任何事情，我似乎无法找到一个可以做到这一点的控件。

非常感谢有关此主题的任何帮助或信息。

到目前为止，我已将菜单添加到网站上。 CSS主要更改颜色，字体和：悬停样式。正如我上面说的那样，当我向CSS添加边框时，似乎没有发生什么？所以我只能假设我缺少一些控制权？

HTML CODE

            <div id="navigation">
                <asp:Menu ID="Menu1" runat="server" DataSourceID="SiteMapDataSource1" StaticEnableDefaultPopOutImage="false" Orientation="Horizontal" 
                    DynamicMenuItemStyle-CssClass="nbottom"
                    DynamicMenuStyle-CssClass="nbottomitem"
                    StaticMenuItemStyle-CssClass="ntop"> 
                </asp:Menu>
                <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="false" />
            </div>

CSS代码

#navigation {
    position: relative;
    float: right;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    font-weight: 400;
    margin-top: 20px;
    color: #A9A9A9;
}
.ntop {
    margin-left: 30px;
    margin-bottom: 20px;
    color: #A9A9A9;
}
.nbottom {
    padding-top: 20px;
    padding-bottom: 17px;
    padding-left: 32px;
    height: 24px;
    background-color: #ffffff;
    width: 360px;
}
.nbottom:hover {
    background-color: #ffffff;
    color: #4fd0f0;
}
.ntop:hover {
    color: #4fd0f0;
}

http://tinypic.com/r/mhfzap/8

Answer 1

您应该使用last-child伪类。

根据docs

：last-child CSS伪类表示任何元素其父母的最后一个子元素。

所以，将它添加到你的CSS

nbottomitem:last-child{
   border-bottom:1px solid #000;
}

ASP.NET菜单样式。动态菜单

1 个答案: