2016-11-25 4 views
0

私はそのページにいるときに特定の色になるようにナビゲーションリンクのスタイルを設定しようとしています。CSS降下セレクタ:いくつかの作業中にしないでください

HTML:

<nav> 
    <ul> 
     <li><a href="index.html" class="selected">Portfolio</a></li> 
    </ul> 
    </nav> 

CSS:

nav a.selected { 
    color: #000; 
} 

上記のコードで動作します。しかし、私がnavセレクターを削除して使用したばかりの場合

a.selected { 
    color: #000; 
} 

このコードは機能しません。

#000のクラスを選択したアンカー要素が必要な場合はどうすればよいですか?

+1

「a.selected」が、より高い特異性セレクタをオーバーライドしない限り、なぜ機能しないのかはまったくありません。デモや完全なコードなしでコメントすることはできません。 – Harry

+1

これは私があなたに示したコードだけで動作します。私は@ハリーが正しい道にあると思う。 – varlogtim

+1

あなたのコードは動作しています: https://jsfiddle.net/024c9et7/ –

答えて

0

ここでの問題は、あなたのセレクタの特異のようです。

意味:上記よりも多くの意味を保持している

nav ul li a.selected { 
    color: #000; 
} 

nav a.selected { 
    color: #000; 
} 

はとまったくないようです。

だからあなたa.selectedが動作するためには、あなたはちょうどあなたがあなたのグローバルアンカー変調器に適用される、またはからより具体的なセレクタを適用する色としてグローバル変調器作り、その前navを削除する必要があります(第2ブロック)上:学習者として

a { 
    color: #6ab47b; 
} 
a.selected { 
    color: #000; 
} 

、私はあなたがしようとするとMozilla Developer Network (MDN)年鑑にこだわるお勧めします。

関連する問題