如何更改導航欄中超鏈接的顏色取決於您所在的頁面？

Question

對於這個例子，讓我們只說一個導航欄包含的元素：

cats - dogs - sheep - cows 

我想使它所以如果你是cats頁上，則cats文本是紅色的，但其餘保持白色，如果你對dogs頁面然後dogs去藍色等等？

Answer 1

創建一個類（例如.active）並將其分配給每個頁面上的活動標記（cats標記將獲得cats頁面上的活動類）。您的代碼應該是這樣的：

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

編輯：如果您想每一個活躍的頁面有不同的顏色，可以按照以及我們的內聯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>