Question

我有一个asp菜单，只有1个（顶级）菜单项。每个菜单项需要具有不同的CSS识别方式（用于独特的悬停等）。我试图避免使用JavaScript解决方案。

目前我无法用asp和CSS来控制单个菜单项。任何帮助，将不胜感激！

<asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false"
                    IncludeStyleBlock="false" Orientation="Horizontal">

    <Items>
        <asp:MenuItem NavigateUrl="~/Default.aspx" Text="My Tab" />
        <asp:MenuItem NavigateUrl="foo.aspx" Text="etc" />
    </Items>
</asp:Menu>

Answer 1

让我们说你有

<ul class="menu">
<li><a href="#foo1">First Item</a></li>
<li><a href="#foo2">Second Item</a></li>
<li><a href="#foo3">Third Item</a></li>
<li><a href="#foo4">Fourth Item</a></li>
<li><a href="#foo5">Fifth Item</a></li>
</ul>

如果你想使用属性选择器，你可以用

ul.menu>li>a[href="foo1"]:hover
{
background-color: blue;
}

如果你想使用伪类，你可以用

ul.menu>li:nth-child(1)>a:hover
{
background-color: blue;
}

如果你想使用class或id，只需在HTML中的li中添加所需的类或ID，然后使用

ul.menu>li.class_name>a:hover /*class used*/
{
background-color: blue;
}

ul.menu>li.id_name>a:hover /*id used*/
{
background-color: blue;
}

你很可能不需要选择器如上所述，并且可能省略ul和其他类似的东西。这只是一个例子。请记住，伪类和属性选择器在各种浏览器中都有不同的支持。

asp：MenuItem / CSS

1 个答案: