将 CSS 应用于特定菜单项 asp.net 菜单

Question

我有一个带有 4 个菜单项的 asp.net 水平菜单。第二个有一个子菜单。 它们都居中对齐，但由于子菜单，第二个元素的文本似乎向左移动。我想将 css 应用到这个特定的菜单项。

                                    <Items>
                                    <asp:MenuItem Text="" Value="" NavigateUrl=""></asp:MenuItem>
                                    <asp:MenuItem Text="" Value="" NavigateUrl=""> // want to apply CSS to this particular Item in such a way that it shouldn't break if the order of the items is changed.
                                        <asp:MenuItem Text="" Value="" NavigateUrl="></asp:MenuItem>
                                    </asp:MenuItem>
                                    <asp:MenuItem Text="" Value="" NavigateUrl=""></asp:MenuItem>

                                </Items>

Answer 1

顶级项目应用了“静态”类，其中的所有项目都有“动态”类（还有其他类，但请检查标记）。您不能将特定类应用于项目（可以，但这是一个巨大的痛苦），但您可以使用 CSS 技巧来获得您正在搜索的结果：

• 特别为项目设置“工具提示” - 它将在 HTML 中呈现为“标题”属性
• 在您的 CSS 文件中按属性添加选择器，即“.navigation a[title='{{THE_TOOLTIP_VALUE}}'] { color: red; }”

注意：您可以通过 Menu 属性或 Menu 控件中的其他元素来玩弄样式和类。如需完整参考，请查看https://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.menu.aspx

个人意见： 默认情况下，asp:Menu 具有预定义的 CSS 类、内联样式，并且您可以应用一些开箱即用的 JavaScript（通过 ScriptResource.axd 处理程序）。在某些时候，您需要删除它们或替换它们......你会开始拉扯你的头发:) 编写你自己的 HTML 菜单生成器需要几个小时 - 不要花几天时间试图弄清楚如何修改 Menu 控件，因为它没有意义。

Answer 2

在对应的asp:Menu 中添加CssClass="SomeMenuClass" 并给出样式细节，例如

.SomeMenuClass a
{/*menu items with submenu*/
    color:black;
}
.SomeMenuClass a:only-child
{/*menu items without submenu*/
    color:Green;
}