ナビゲーションバーで現在のページのタイトルを色に変更します。

Question

私はこれが愚かな質問であることを知っているので、こんにちはと謝罪しますが、私はあまりにも長い間それを使いこなしてきましたが、まだ解決できる解決策を見つけることができません。私は自分のウェブサイトの上部にあるナビゲーションバーに現在のページのタイトルの色を変えようとしています。ナビゲーションバーは、とHTMLで構築されています。

<div class="navbar"> 
     <a href="index.html" class="active" >Home</a> 
     <a href="indian.xml">Indian</a> 
     <a href="italian.xml">Italian</a> 
</div> 

、それをスタイルにしようとするCSSは次のとおりです。

.navbar{ 
overflow: hidden; 
background-color: #F5861F; 
width: 100%; 
} 
.navbar a{ 
    float: left; 
    display: block; 
    color: #f2f2f2; 
    text-align: center; 
    padding: 14px 16px; 
    text-decoration: none; 
} 
.navbar a:active{ 
    color:#ffe7d1; 
} 
.navbar a:visited{ 
    color:#8b4e14; 
} 
.navbar a:hover{ 
    color:#874404; 
    font-size:20px; 
} 
.navbar a:current{ 
    color:#ffe7d1; 
} 

：私はアクティブではないことを読んだ後「.navbar現在」が残っています（私はclass = "active"をclass = "current"に変更しましたが）これもうまくいきません。

私はここで何が欠けていますか？とても愚かなことに答える時間をとってくれてありがとう。

Answer 1

この

a.active {color: red} 

a:activeを試みるは、クラスを表すのではなく、間違いがある場合<a>素子

https://www.w3schools.com/css/css_pseudo_classes.asp

Answer 2

:activeの疑似クラスのためのセレクタです。

あなたはJSを経由して、現在のページのリンク/タイトルにクラス `active` /` current`を追加/変更する必要があり、この

.navbar a.active{ 
    color:#ffe7d1; 
}