Wie ändert man die Farbe eines Hyperlinks in der Navigationsleiste, je nachdem auf welcher Seite Sie sich befinden?

Question

Für dieses Beispiel sagen wir einfach eine navbar die Elemente enthält:

cats - dogs - sheep - cows 

Ich will es machen, so, wenn Sie auf der cats Seite sind, ist die cats Text rot, aber der Rest bleibt weiß, wenn Sie sind die dogs Seite dann dogs geht blau etc. etc?

Answer 1

Erstellen Sie eine Klasse (z. B. .active) und weisen Sie sie dem aktiven Tag auf jeder Seite zu (das Katzen-Tag würde die aktive Klasse auf der Katzen-Seite erhalten). Ihr Code würde wie folgt aussehen:

HTML

<a class="active">cats</a> 
<a href="dogs.html">dogs</a> 
<a href="sheep.html">sheep</a> 
<a href="cows.html">cows</a> 

CSS

a { 
    color: white; 
} 

a.active { 
    color: red; 
} 

bearbeiten: Wenn Sie jede aktive Seite wollen eine andere Farbe haben, können Sie als naja uns inline CSS.

<a style="color:red">cats</a> 
<a href="dogs.html">dogs</a> 
<a href="sheep.html">sheep</a> 
<a href="cows.html">cows</a>