删除 controlRenderingCompatibilityVersion="3.5" 后，ASP.NET 4.0 菜单控件呈现问题

Question

我实际上正在将网站迁移到 ASP.NET 4.0，但在新的菜单控件呈现方面遇到了问题。我的网站大量使用嵌套菜单。使用悬停效果，布局由主题和皮肤与链接 CSS 的组合定义。

如果我删除页面 controlRenderingCompatibilityVersion 属性，它们将不再呈现为嵌套表，而是呈现为 ul/li 标签。这在很多方面打破了我的布局。非常欢迎任何关于复杂 ASP.NET 菜单布局迁移的建议。

已编辑：标记和 CSS 详细信息作为对评论的响应

皮肤文件

<asp:Menu runat="server" DynamicHorizontalOffset="2" Orientation="Horizontal" SkipLinkText=""
    StaticPopOutImageUrl="~/App_Images/Themes/arrow_down.gif" DynamicPopOutImageUrl="~/App_Images/Themes/arrow_right.gif">
    <StaticMenuItemStyle CssClass="MenuDefaultMenuItemStyle" />
    <DynamicMenuItemStyle  CssClass="MenuDefaultMenuItemStyle" />

    <StaticSelectedStyle CssClass="MenuDefaultSelectedStyle" />
    <DynamicSelectedStyle CssClass="MenuDefaultSelectedStyle" />

    <StaticHoverStyle CssClass="MenuDefaultHoverStyle" />
    <DynamicHoverStyle CssClass="MenuDefaultHoverStyle" />
</asp:Menu>

<asp:Menu runat="server" SkinId="MenuVertical" DynamicHorizontalOffset="2" SkipLinkText=""
    StaticPopOutImageUrl="~/App_Images/Themes/arrow_right.gif" DynamicPopOutImageUrl="~/App_Images/Themes/arrow_right.gif">
    <StaticMenuItemStyle CssClass="MenuVerticalMenuItemStyle" />
    <DynamicMenuItemStyle  CssClass="MenuVerticalMenuItemStyle" />

    <StaticSelectedStyle CssClass="MenuVerticalSelectedStyle" />
    <DynamicSelectedStyle CssClass="MenuVerticalSelectedStyle" />

    <StaticHoverStyle CssClass="MenuVerticalHoverStyle" />
    <DynamicHoverStyle CssClass="MenuVerticalHoverStyle" />
</asp:Menu>

样式表的相关部分

.MenuDefaultMenuItemStyle
{
    background-color: #D5DCE1;
    color: #234875;
    padding: 2px;
    width: 100%;
}

.MenuDefaultSelectedStyle
{
    background-color: #3C5778;
    color: #FFFFFF;
    padding: 2px;
    width: 100%;
}

.MenuDefaultHoverStyle
{
    background-color: #666666;
    color: #FFFFFF;
    padding: 2px;
    width: 100%;
}

.MenuVerticalMenuItemStyle
{
    background-color: #FFFFFF;
    border: 1px solid #D5DCE1;
    color: #234875;
    height: 30px;
    padding: 2px;
    width: 100%;
}

.MenuVerticalSelectedStyle
{
    background-color: #003366;
    border: 1px solid #D5DCE1;
    color: #FFFFFF;
    height: 30px;
    padding: 2px;
    width: 100%;
}

.MenuVerticalHoverStyle
{
    background-color: #EEEEEE;
    border: 1px solid #000000;
    color: #234875;
    height: 30px;
    padding: 2px;
    width: 100%;
}

Answer 1

如果从 web.config 中删除 controlRenderingCompatibilityVersion 属性，菜单呈现的默认模式会隐式从 Table 更改为 List。如果您仍然希望使用表标签呈现菜单，则需要通过添加 RenderingMode 属性在 asp:menu 控件中明确指定这一点：

<asp:Menu runat="server" RenderingMode="Table" ... >
   ...
</asp:Menu>

（s. 也是 MSDN 中的备注部分：http://msdn.microsoft.com/en -us/library/system.web.ui.webcontrols.menu.renderingmode.aspx)

Answer 2

我遇到了发布的菜单呈现奇怪的问题。将 RenderingMode="List" 添加到菜单标记解决了我的问题。

<asp:Menu runat="server" RenderingMode="List" ... >
   ...
</asp:Menu>