3

<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>

クラスが設定されていることは明らかですが、activeLinkcss はul.navigation li a. 提案してください。

4

1 に答える 1

6

これは、ul.navigation li aが よりも具体的であるためです.activeLink。

ポイントシステムについて考えると、要素ulは1ポイント、クラスnavigationは10ポイントです。したがって、 10の対ul.navigation li aだけで少なくとも11ポイントがあります.ul.navigationactiveLink

CSS の特異性に関する詳細な記事です。

http://www.stuffandnonsense.co.uk/archives/css_specificity_wars.html">

.activeLink解決策については、より具体的にあなたを参照する必要があり#idますul.navigation li a.activeLink。

cssがあなたと共にありますように！

于 2012-11-28T05:26:46.017 に答える