ASP.Net 子项未继承 MenuItem 格式

ASP.Net MenuItem formatting isn't being inherited by the child items

我正在使用 C# 以编程方式构建 ASP.Net 4.5 菜单。顶部菜单项的格式符合我的喜好,但格式并未被子项继承。我最关心的格式有两件事:StaticEnableDefaultPopOutImage,它控制小箭头是否显示在 MenuItem 旁边,以及 ItemSpacing。前者在 asp:Menu 定义中设置为 false 并且适用于顶部菜单项(即没有小箭头显示),但不能用于子项(小箭头显示在子项旁边)项目)。后者设置为 75px,顶部菜单项之间的间距很好。然而,子项和它们的子项挤在一起。我不确定如何控制这种行为。最后,菜单在母版页中定义。这是我在 Master 中的菜单代码:

<asp:Menu runat="server" CssClass="bgcell_top_nav" ID="menuMain" Orientation="Horizontal" RenderingMode="Table" StaticEnableDefaultPopOutImage="false" Width="100%" ItemWrap="false" Height="250" DynamicVerticalOffset="8" StaticDisplayLevels="1">
    <StaticMenuItemStyle ItemSpacing="75px" />
</asp:Menu>

这是我背后的代码:

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        //top menu items
        MenuItem ApplicationFunctionality = new MenuItem();
        ApplicationFunctionality.Text = "Applications";
        ApplicationFunctionality.SeparatorImageUrl = "~/images/menu-pipe.png";
        this.menuMain.Items.Add(ApplicationFunctionality);
        MenuItem DatabaseFunctionality = new MenuItem();
        DatabaseFunctionality.Text = "Databases";
        DatabaseFunctionality.SeparatorImageUrl = "~/images/menu-pipe.png";
        this.menuMain.Items.Add(DatabaseFunctionality);

        //sub menu items
        MenuItem Application_Add = new MenuItem();
        Application_Add.Text = "Add";
        ApplicationFunctionality.ChildItems.Add(Application_Add);
        MenuItem Application_Search = new MenuItem();
        Application_Search.Text = "Search";
        ApplicationFunctionality.ChildItems.Add(Application_Search);
        MenuItem Application_Reports = new MenuItem();
        Application_Reports.Text = "Reports";
        ApplicationFunctionality.ChildItems.Add(Application_Reports);

        MenuItem CreateInternalApplication = new MenuItem();
        CreateInternalApplication.Text = "Internal";
        CreateInternalApplication.NavigateUrl = "~/TemplateForms/ApplicationCreationTemplateForm.aspx";
        Application_Add.ChildItems.Add(CreateInternalApplication);
        MenuItem CreateExternalApplication = new MenuItem();
        CreateExternalApplication.Text = "External";
        Application_Add.ChildItems.Add(CreateExternalApplication);
    }
}

我附上了一张图片,这样人们就可以看到我在说什么问题。

非常感谢任何有关如何设置子项格式的指导。

删除箭头图标:

问题是 StaticEnableDefaultPopOutImage="false" 仅适用于静态菜单级别,而您有 StaticDisplayLevels="1"。另外两个级别是动态的,所以你还需要DynamicEnableDefaultPopOutImage="false".

添加间距:

要为动态级别添加间距,您可以使用:

<DynamicMenuItemStyle ItemSpacing="75px" />

正在应用自定义样式:

或者,可以将自定义样式应用于每个菜单级别。这会让您更好地控制菜单的外观。在您的菜单中使用 LevelMenuItemStyles 声明菜单项级别的样式。例如,我在这里为前 3 个菜单项级别添加样式 类:

<asp:Menu runat="server" CssClass="bgcell_top_nav" 
        ID="menuMain" Orientation="Horizontal" RenderingMode="Table"
        StaticEnableDefaultPopOutImage="false" Width="100%"
        ItemWrap="false" Height="250" DynamicVerticalOffset="8"
        StaticDisplayLevels="1">
    <LevelMenuItemStyles>
        <asp:MenuItemStyle CssClass="menuItemLevel1"/>
        <asp:MenuItemStyle CssClass="menuItemLevel2"/>
        <asp:MenuItemStyle CssClass="menuItemLevel3" />
    </LevelMenuItemStyles> 
</asp:Menu>

那么您应该可以自定义菜单的项目级样式,例如

.menuItemLevel2{
    margin-left:7px;
}
.menuItemLevel3{
    margin-left:12px;
}