Header 在 <form> <asp> 或之外

Question

所以我注意到 auto-generated [此处的代码] 中的任何 html 从 master 创建新的 web 表单可以更改为从 master 创建的表单。

我有一个 header 在 ul 中制作，每个元素都是一个 li。我希望所选页面的 li 在所选页面上变为 li class-"active" 。

因为大师的观点是你制作的所有其他表格都继承了它的属性，所以在 [代码此处] 中放置一个 header 使得它在我制作新表格时不存在。

我的问题是：有没有一种方法可以让 li 变成 li class-"active" 而不必通过将其放入 header 来覆盖所有代码然后复制并粘贴我的 header 代码，但只更改一个 li.

<form id="form1" runat="server">
    <div>
        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
        <div class="bodyGradient">
        <header class="navbar navbar-inverse navbar-static-top">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                </div>
                <div class="navbar-collapse collapse"> 
                    <ul class="nav navbar-nav navbar-left">
                        <li>
                             <a href="/Home.aspx">{Someone's Domain}</a>
                        </li>
                    </ul>
                    <ul class="nav navbar-nav navbar-right">
                        <li>
                            <a href="/Home.aspx">Home</a>
                        </li>
                        <li>
                             <a href="/">About</a>
                        </li>
                        <li>
                             <a href="/">Portfolio</a>
                        </li>
                        <li>
                             <a href="/">CryptoGame</a>
                        </li>
                        <li>
                             <a href="/">Photos</a>
                        </li>
                            <li>
                             <a href="/">Contact</a>
                        </li>
                    </ul>
                </div>
            </div>
        </header>
      </div>
        </asp:ContentPlaceHolder>
    </div>
    </form>

Answer 1

您似乎想要根据用户正在访问的页面突出显示活动菜单项，您的菜单存储在 MasterPage 中并在多个页面中使用。

有很多方法可以解决这个问题，并且有很多关于 SO 的示例可供查看。环顾四周，这里只是一些：

How to set css class on active menu item using a masterpage?

active menu item - asp.net mvc3 master page

How to highlight active page in a masterpage menu?

ASP.NET MVC: Masterpage: How to set css class on active menu item

这是我上次运行所做的（伪）：

（在 ASP.NET 母版页中：）

<li class="<%=GetActiveForButton('Home')>">Home</li>
<li class="<%=GetActiveForButton('About')>">About</li>

（在代码隐藏 .cs 中）

public string GetActiveForButton(string button)
{
    string url = HttpContext.Current.Request.Url.AbsoluteUri.ToLower();

    if (url.Contains("home.aspx") && button == "Home")
    {
        return "active-button";
    }
    else if (url.Contains("about.aspx") && button == "About")
    {
        return "active-button";
    }

    return "";
}

注意：这只是一个示例。这段代码可以被彻底清理，组合逻辑，使用枚举等等。它是伪代码......但你应该能够理解这个想法。

Header 在 <form> <asp> 或之外

Header in <form> <asp> or outside

html

css

asp.net

visual-studio