Question

我的网站菜单栏中有<asp:LinkButton>个。菜单栏和这些按钮具有Css设置。我正在寻找的是突出显示与哪个页面处于活动状态相对应的按钮。

我可以动态地将新的Css类应用于我的Linkbuttons（由浏览器呈现为锚标记），但新应用的CSS将被现有类覆盖。我试过分析那里的任何错误，但没有运气。这是我的代码 -

HTML的一部分 -

<ul class="navigation">
   <li>
       <asp:LinkButton ID="lbtn_about" runat="server" OnClick="lbtn_about_Click">About Us</asp:LinkButton>
   </li>

现有的css -

 ul.navigation li a
  {
    text-decoration: none;
    display: block;
    color: #838383;
    height: 24px;
  }

要动态设置的Css类 -

.activeLink
  {
    color: #588500;
  }

在我的页面加载中，我正在执行此操作 -

LinkButton lb = (LinkButton)Page.Master.Master.FindControl("lbtn_about");
lb.CssClass = "activeLink";

在浏览器中呈现的HTML -

<a id="ctl00_ctl00_lbtn_about" class="activeLink" href="javascript:__doPostBack('ctl00$ctl00$lbtn_about','')">About Us</a>

很明显，该类已设置，但activeLink css被ul.navigation li a覆盖。建议请。

Answer 1

这是因为ul.navigation li a比.activeLink更具体。

如果你考虑一个点系统，一个元素说ul有一个点，那么一个类说navigation就有10.因此ul.navigation li a只有ul.navigation至少有11个点activeLink 1}}与10的.activeLink对比。

http://www.stuffandnonsense.co.uk/archives/css_specificity_wars.html“＆GT;

至于解决方案，您只需要更具体地引用#id，无论是ul.navigation li a.activeLink还是{{1}}。

出去，可能css和你在一起！