Hexo，导航活动状态

Question

我是Hexo的新手，想知道是否有办法在当前页面的导航项中添加a：active状态？

HTML ...

<nav>
  <ul>
   <li>
    <a href="index.html">INDEX</a>
   </li>
  </ul>
<nav>

... CSS

a:active {
   color:green;
}

Answer 1

首先-a:active并非由服务器设置-:active伪类表示该元素已被用户激活-阅读更多in the documentation < / p>

您真正想要的是一个锚标记，当它的href等于当前访问的URL时，该锚标记由常规类标记。在Hexo中，您可以使用the is_active helper：

因此，您的代码可能看起来像这样（在代码添加新的is-active类以使其锚定  是当前页面）：

<nav>
  <ul>
    <li>
      <a href="index.html" class="link <% if(is_current('index.html')) { %>is-active<% } %>">INDEX</a>
    </li>
  </ul>
<nav>

CSS：

a.is-active {
  color:green;
}