Asp.net 菜单样式不像我期望的那样工作

Asp.net 菜单样式不像我期望的那样工作,asp.net,css,Asp.net,Css,因此,我试图在我的网站上放一个菜单,但我很难让子菜单项的文本比第一个菜单项的文本小。这是我的密码: <asp:Menu ID="Menu1" runat="server" Orientation="Horizontal"> <LevelMenuItemStyles> <asp:MenuItemStyle CssClass="subMenuStyle" /> </LevelMenuItemStyles

因此,我试图在我的网站上放一个菜单,但我很难让子菜单项的文本比第一个菜单项的文本小。这是我的密码:

<asp:Menu ID="Menu1" runat="server" Orientation="Horizontal">
        <LevelMenuItemStyles>
            <asp:MenuItemStyle CssClass="subMenuStyle" />
        </LevelMenuItemStyles>
        <LevelSubMenuStyles>
            <asp:SubMenuStyle CssClass="masterBannerMenu" />
        </LevelSubMenuStyles>
            <Items>
                <asp:MenuItem Text="WHERE I'VE BEEN" NavigateUrl="~/whereivebeen.aspx">
                    <asp:MenuItem Text="UNESCO Sites" NavigateUrl="~/unesco.aspx" />
                    <asp:MenuItem Text="Places" NavigateUrl="~/BlogPosts.aspx" />
                </asp:MenuItem>
            </Items>
        </asp:Menu>

只有子菜单样式元素中的内容才会被应用。我尝试过切换两个CSS类,在asp:Menu控件中设置字体大小,然后应用CSS样式,但没有成功。同样,我试图使我的子菜单项文本(UNESCO网站和地点)小于一级菜单(我去过的地方)

您需要更改.NET标记和/或代码,使其生成类似于以下内容的HTML:

<a href="#Menu1_SkipLink"><img alt="Skip Navigation Links" src="/TravelJoansBlog/WebResource.axd?d=i8kPrDg0W2gPsNdgiFoKNbdLkjHOBO6T-YtC_Usb-id70m3Q7jX8wpftWKKoZFCuuiThX_JLEnw1KCG7FBKqB3_JiRZTcYRUnLGsCYCvOwo1&amp;t=634970873020000000" width="0" height="0" style="border-width:0px;" /></a>
<div id="Menu1">
    <ul class="level1 masterBannerMenu">
        <li><a class="popout level1 subMenuStyle" href="whereivebeen.aspx">WHERE I'VE BEEN</a></li>
    </ul>
    <ul class="level2">
        <li><a class="level2" href="unesco.aspx">UNESCO Sites</a></li><li><a class="level2" href="BlogPosts.aspx">Places</a></li>
    </ul>


请参见

和yes,这两个CSS类的文本大小不同,请考虑编辑问题以向我们显示实际呈现的html和相关CSS。在
  • 中嵌套
    不是有效的html,可能是大多数问题。这可能是
    控件的一个笼统的语句。因为这些控件没有使用数据库来填充它们的值,我应该只使用HTML吗?看来我会的?哦,绝对会的。如果您可以使用好的ol'style HTML来完成您的工作,而不是使用任何
    控件,那么就这样做。保持简单。我不知道当鼠标悬停在上面时如何使level2项目弹出。我无法让它显示在下面的“我去过的地方”和没有文字装饰
    .masterBannerMenu a
        {
            font-family:"Century Gothic";
            font-size: 16pt;
            width: auto;
            text-align: left;  
            color: Black;
            text-decoration: none;   
        }
        .subMenuStyle a
        {
            font-family:"Century Gothic";
            font-size: 12pt;
            width: auto;
            text-align: left;  
            color: Black;
            text-decoration: none;   
        }
    
    <a href="#Menu1_SkipLink"><img alt="Skip Navigation Links" src="/TravelJoansBlog/WebResource.axd?d=i8kPrDg0W2gPsNdgiFoKNbdLkjHOBO6T-YtC_Usb-id70m3Q7jX8wpftWKKoZFCuuiThX_JLEnw1KCG7FBKqB3_JiRZTcYRUnLGsCYCvOwo1&amp;t=634970873020000000" width="0" height="0" style="border-width:0px;" /></a>
    <div id="Menu1">
        <ul class="level1 masterBannerMenu">
            <li><a class="popout level1 subMenuStyle" href="whereivebeen.aspx">WHERE I'VE BEEN</a></li>
        </ul>
        <ul class="level2">
            <li><a class="level2" href="unesco.aspx">UNESCO Sites</a></li><li><a class="level2" href="BlogPosts.aspx">Places</a></li>
        </ul>