Javascript 如何更改导航栏中的活动链接颜色

就像这个“HTML主页”按钮的颜色是绿色的，因为它是活动链接

那么如何在我的网站上做同样的事情呢

我的HTML代码：

<!-- Website fixed header-->   
<div class="dropdown website" style="left:0px;">
<button class="dropbtn website"><a href="file:///C:/Users/Kamal/Desktop/New%20folder%20(2)/Homepage.html" style="text-decoration:none"><div class="hoverwebsite">Website Name</div></a></button>    
<div class="dropdown-content website" style="left:0;">
</div>
</div>

我的CSS：

    /* Top header orange color */
div#fixedheader {
position:fixed;
top:0px;
left:0px;
width:100%;
background: url(images/header.png) repeat-x;
padding:20px;


}


/* Dropdown hover button */
.dropbtn.website {
top:0px;
position: fixed;
background-color: #000000;
color: white;
padding: 10px;
font-size: 16px;
border: none;
cursor: pointer;
left: 0px;


}

.dropdown.website {
top: 43px;
position: fixed;
display: inline-block;

}

.dropdown-content.website {
   display: none;
position: fixed;
left: 0;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.dropdown-content.website a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}

.dropdown-content.website a:hover {
background-color: #f1f1f1;
color: #f1f1f1;}

.dropdown.website:hover .dropdown-content {
 display: block;

 }

.dropdown.website:hover .dropbtn.website {
 background-color: #4CAF50;

 }

.hoverwebsite {
color: #f2f2f2;
font-weight:bold;

}
a:active {
background-color: yellow;
}


</style>

/*顶部标题为橙色*/
div#fixedheader{
位置：固定；
顶部：0px；
左：0px；
宽度：100%；
背景：url（images/header.png）repeat-x；
填充：20px；
}
/*下拉悬停按钮*/
.dropbtn.com{
顶部：0px；
位置：固定；
背景色：#000000；
颜色：白色；
填充：10px；
字体大小：16px；
边界：无；
光标：指针；
左：0px；
}
.dropdown.com{
顶部：43px；
位置：固定；
显示：内联块；
}
.下拉列表-content.website{
显示：无；
位置：固定；
左：0；
背景色：#f9f9f9；
最小宽度：160px；
盒影：0px 8px 16px 0px rgba（0,0,0,0.2）；
}
.下拉列表-content.a{
颜色：黑色；
填充：12px 16px；
文字装饰：无；
显示：块；
}
.dropdown-content.website a:悬停{
背景色：#f1f1；
颜色：#f1f1；}
.下拉列表.网站：悬停.下拉列表内容{
显示：块；
}
.dropdown.website:hover.dropbtn.website{
背景色：#4CAF50；
}
.Hover网站{
颜色：#F2F2；
字体大小：粗体；
}
a:主动的{
背景颜色：黄色；
}

这是我的名片。如果你需要更多的细节，请告诉我

在要保持活动状态的锚定标记中添加

class=“active”

div#fixedheader{
位置：固定；
顶部：0px；
左：0px；
宽度：100%；
背景：url（images/header.png）repeat-x；
填充：20px；
}
/*下拉悬停按钮*/
.dropbtn.com{
顶部：0px；
位置：固定；
背景色：#000000；
颜色：白色；
字体大小：16px；
边界：无；
光标：指针；
左：0px；
填充：0px；
}
.dropdown.com{
顶部：43px；
位置：固定；
显示：内联块；
}
.下拉列表-content.website{
显示：无；
位置：固定；
左：0；
背景色：#f9f9f9；
最小宽度：160px；
盒影：0px 8px 16px 0px rgba（0,0,0,0.2）；
}
.下拉列表-content.a{
颜色：黑色；
填充：12px 16px；
文字装饰：无；
显示：块；
}
.dropdown-content.website a:悬停{
背景色：#f1f1；
颜色：#f1f1；}
.下拉列表.网站：悬停.下拉列表内容{
显示：块；
}
.dropdown.website:hover.dropbtn.website{
背景色：#4CAF50；
高度：38px；
}
.Hover网站{
颜色：#F2F2；
字体大小：粗体；
}
a{
高度：38px；
显示：块；
填充顶部：16px；}
a、 活跃的{
背景色：#4CAF50；
颜色：#F2F2；
}

我已经编辑了答案，请看编辑1。如果答案对您有效，请将其标记为已接受。这可能对其他人有所帮助。请查看编辑2以设置页边距。谢谢您是否使用了html代码的编辑版本？你也有这个，我故意这样做，以显示在积极和非积极的联系不同。。看看这支笔，看看html部分中如何放置脚本