Question

我正在创建导航菜单，我（1）努力去除选择子菜单时出现的白色背景。我已经搜索了高低，我尝试创建并添加一个z-index = 1000的类到动态菜单样式，以及简单地将背景设置为透明。您希望在子菜单后面看到的渐变，但所有的空白都不是。此外，我希望整个菜单直接下拉到部门标题下。请尽可能帮助我。我已经搜索了几天的解决方案，我访问了其他几个网站。如果可能的话，我希望使用CSS或ASP.NET控件的属性以编程方式解决此问题。

参考：使用.Net 4 语言= VB 软件：Visual Studio Professional

问题图片： http://i1332.photobucket.com/albums/w601/OfficialMsRae/Menu_zps7051ce8a.png

这是我的ASP.Net代码：

<asp:Content ID="Content4" ContentPlaceHolderID="NavigationContentPlaceHolder" runat="server">
<form runat="server">
<div id="NavBarDiv">
    <asp:Menu runat="server" 
        CssClass="NavBar"
        DataSourceID="SiteMapDataSource"  
        MaximumDynamicDisplayLevels="4" 
        StaticEnableDefaultPopOutImage="false" 
        staticdisplaylevels="1"
        staticsubmenuindent="10" 
        target="_blank" 
        Font-Names="Calibri"  
        EnableViewState="false" 
        IncludeStyleBlock="false" 
        Orientation="Horizontal"
        BorderStyle="Solid"
        Borderwidth="1px">
        <LevelMenuItemStyles>
            <asp:MenuItemStyle CssClass="level1"/>
            <asp:MenuItemStyle CssClass="level2"/>
            <asp:MenuItemStyle CssClass="level3"/>
        </LevelMenuItemStyles>
        <StaticHoverStyle BackColor="Transparent" />

        <%--             <StaticSelectedStyle BackColor="White" BorderColor="Gray" BorderWidth="2px" />
        <StaticSelectedStyle BackColor="Black" />
        <StaticMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
        <DynamicHoverStyle BorderStyle="Double" BorderWidth="2px" BorderColor="Gray" />
        <DynamicMenuStyle BackColor="none" />
        <DynamicSelectedStyle BackColor="#000000" BorderStyle="Double" />

        <StaticHoverStyle BackColor="#000000" ForeColor="White" />--%>


    </asp:Menu>
    <asp:SiteMapDataSource ID="SiteMapDataSource" ShowStartingNode="false" runat="server" />
</div>

以下是我的样式表的链接： https://www.dropbox.com/s/rx8dr05gf6psxvm/Styles.css

感谢任何帮助。如果我需要提供更多信息，请告诉我。

Answer 1

我认为发生这种情况的原因是因为背景渐变仅覆盖了文本的宽度。例如：

|[AR Dashboard]  |
|[AR Performance]|

AR性能更长，使盒子更大。你需要做的是给每个菜单项（AR Dashborad和AR Performance一个固定的宽度，例如：

.menuItem {
    width: 100px;
    backgroundcolor: yourgradient;
}

之后，它们应该看起来像你想要的那样：

|[AR Dashboard]||||
|[AR Performance]||

删除ASP.Net子菜单上的白色背景

1 个答案: