CSSの問題 - ナビゲーション項目のアクティブ状態

Question

次のテストサイト（http://tronitech.brettatkin.com/index.asp）では、アクティブなページであるときに各ナビゲーション要素の見た目を変えてください。

私はそのページがアクティブなときにアンカー要素にクラスを割り当てました。

CSSをインラインで追加すると、それは機能します（たとえばホームページなど）が、クラスにドロップしたときには機能しません。ここで

は私のCSSです：

#navigation ul li .active-link a { 
    color: #326ea1; 
    background-image: url(/images/nav-current.jpg); 
    background-repeat: repeat-x; 
} 

私はそれを継承して何かだと思うが、私は問題を見ていないよ...

ブレット

おかげ

Answer 1

変更あなたのセレクタは次のようになります

#navigation ul li a.active-link 

a .active-linkは、アンカータグをクラスactive-linkを持つ子と照合しようとします。 a.active-linkは、クラスactive-linkのアンカータグと一致します。

Answer 2

#navigation ul li .active-link aではなく、#navigation ul li a.active-linkである必要があります。最初のルールでは、クラスactive-linkの第2のリンクがクラスactive-linkとのリンクを宣言しています。これはあなたのマークアップに含まれています。

実際、両方のセレクタは長すぎます。