html - 在HTML/CSS中设置选定的菜单项

我有3个链接。当用户单击第一个链接（EQUIP1）时，我需要将其显示为已访问。然后剩下的两个链接显示为未访问。然后，当用户选择第二个链接（EQUIP2）时，其余两个链接应显示为未访问。我可以更改字体的颜色以表示这是当前启用的链接。

<tr align="center">
  <td class="mainTBSectionTab">
     <a href="...">EQUIP1</a>
   </td>
   <td class="mainTBSectionTab">
     <a href="...">EQUIP2</a>
   </td>
   <td class="mainTBSectionTab">
     <a href="...">EQUIP3</a>
   </td>
</tr>

最佳答案

根据您提供的信息并假设您使用的是静态页面，可以为每个页面的活动链接提供一个.selected类。

根据您想要的内容，您可以使用默认样式

.mainTBSectionTab
    color: #000
    text-decoration: none

.mainTBSectionTab.selected
    text-decoration: underline

然后，equip1.html的HTML文件将如下所示

<tr align="center">
    <td class="mainTBSectionTab selected">
         <a href="...">EQUIP1</a>
    </td>
    <td class="mainTBSectionTab">
         <a href="...">EQUIP2</a>
    </td>
    <td class="mainTBSectionTab">
         <a href="...">EQUIP3</a>
    </td>
</tr>

在其他页面上，您可以在相应的链接上应用.selected类，以模拟所选链接的效果