html - ASP.NET 主页导航当前页面 Css

标签 html css asp.net master-pages nav

我正在尝试根据当前显示的页面设置 导航栏 中 LinkBut​​ton 的背景颜色。如果在该页面上,我希望它是橙色的,如果不在该页面上,我希望它是黑色的。

我现在有这个:

<nav>
    <asp:LinkButton ID="lnkB1TSUser" runat="server" OnClick="lnkB1TSUser_Click">B1TS User</asp:LinkButton>
    <asp:LinkButton ID="lnkClient" runat="server" OnClick="lnkClient_Click">Client</asp:LinkButton>
    <asp:LinkButton ID="lnkUserClient" runat="server" OnClick="lnkUserClient_Click">User Client</asp:LinkButton>
</nav>

我知道一般如何使用 CSS,但我不知道如何设置我所在的特定页面以具有背景。

如果我使两个 CSS 类处于事件状态和非事件状态:

.active {
  background-color: orange;
}
.inactive {
  background-color: black;
}

这会帮助我实现它吗?如果我可以突出显示(橙色)我正在访问的页面,那就太好了。而且我不知道如何使用母版页执行此操作。非常感谢您的帮助。

目前 onclick 事件仅用于在页面之间导航。

最佳答案

我不太喜欢在代码中添加样式,但我认为您别无选择,只能使用服务器端代码或 Javascript。以下是使用 C# 服务器端代码执行此操作的方法,使用 LinkBut​​tonCommandArgument 来存储页面名称:

<nav>
    <asp:LinkButton CommandArgument="page.aspx" ID="lnkB1TSUser" runat="server" OnClick="lnkB1TSUser_Click">B1TS User</asp:LinkButton>
    <asp:LinkButton CommandArgument="page2.aspx" ID="lnkClient" runat="server" OnClick="lnkClient_Click">Client</asp:LinkButton>
    <asp:LinkButton CommandArgument="page3.aspx" ID="lnkUserClient" runat="server" OnClick="lnkUserClient_Click">User Client</asp:LinkButton>
</nav>
<%
    foreach(var control in new LinkButton[] { lnkB1TSUser, lnkClient, lnkUserClient })
    {
        if (HttpContext.Current.Request.Url.AbsolutePath.EndsWith(control.CommandArgument))
            control.ForeColor = System.Drawing.Color.Orange;
    }
%>

关于html - ASP.NET 主页导航当前页面 Css,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31872036/

相关文章:

javascript history.back 丢失搜索结果

javascript - 使用 jquery 重新加载/刷新页面部分

javascript - css在不同维度上的定位不同

html - 如何用div替换html背景图片?

c# - 这个共享的 DbCommand 对象线程安全吗?

asp.net - 在已创建的 DataTable 对象上使用 SELECT DISTINCT?

html - 如何在没有绝对定位的情况下适应 100% 宽度的元素?

php - 刷新单个表格单元格而不刷新整个页面

asp.net - ValidationAttribute 类的 RequiresValidationContext 属性有什么用?

javascript - div 内的 anchor 标记。当 div 单击它时,页面应重定向到一个页面,如果单击 anchor ,页面应重定向到另一页面