1

マスターページのタブは次のとおりです。

<nav>
     <ul id="menu">
         <li><%: Html.ActionLink("Home", "Index", "Home")%></li>
         <li><%: Html.ActionLink("About", "About", "Home")%></li>
     </ul>
</nav>

そしてここにcssがあります:

ul#menu li.selected a {
    background-color: #a6e2a6;
    color: #000;
}

しかし、私が背景色に何をしても、それは常に同じままです。選択したタブの背景色と高さを変更するにはどうすればよいですか?

4

2 に答える 2

1

セレクターは、現在のページに対応するリンクの:activeスタイルを設定しませんが、ユーザーが現在クリックしているリンクのスタイルを設定します。

セレクターは、ユーザーがリンクにカーソルを合わせたときにリンクのスタイルを設定するセレクターと非常によく似ています:active:hoverこれらは両方とも、マウスのアクションに応答するセレクターです。

これはかなり明白な振る舞いを示すサンプルです:http://jsfiddle.net/NuExP/

質問を変更した後に編集します。

@ovが言ったように、現在アクティブなページのセレクターがないため、リンクにクラスを追加して、現在アクティブなページであることを示す彼のソリューションは正しいです。

于 2012-04-07T08:15:51.593 に答える
1

現在選択されているタブのスタイルを変更しようとしていると思いますか?その場合は、.currentサーバー側のようなcssクラスをタブの1つに追加する必要があります(また、タブ内のリンクではなくli要素のスタイルを設定する必要がある場合がありますが、すべて現在のcss構造に依存します)

:active疑似クラスは別の目的で使用されます。たとえば、アンカーをクリックして押したままにすると、疑似クラスが適用されていることがわかります。

于 2012-04-07T08:18:40.697 に答える