Question

我希望能够根据我所在的文件更改文件中哪个菜单项。我在我的三个文件中包含menu.html（下面的文件）：a.html，b.html和c.html。我怎么能只使用html和css这样做？我使用Boostra菜单。我基本上想根据我当前的文件更改处于活动状态的菜单项。

<ul id="navbar_menu" class="nav nav-tabs nav-justified">
            <li id="a"><a href="#">a</a></li>
            <li id="b"><a href="#">b</a></li>
            <li id="c"><a href="#">c</a></li>   
        </ul>

Answer 1

据我了解，您使用PHP包含菜单。

您可以执行此操作以自动查找当前页面的相关菜单：

在您的3页中添加＆＃34;相关课程＆＃34;到作为包装器的div / section：

<section class="a">
   <!-- your php include for menu-->
</section>

第二页：

<section class="b">
   <!-- your php include for menu-->
</section>

第三页：

<section class="c">
   <!-- your php include for menu-->
</section>

在你的CSS中：

.a > li#a {
   /* Active Menu Style */
}
.b > li#b {
   /* Active Menu Style */
}
.c > li#c {
   /* Active Menu Style */
}

这将启用包含php include文件的当前页面的菜单：

<ul>
    <li id="a"><a href="#">a</a></li>
    <li id="b"><a href="#">b</a></li>
    <li id="c"><a href="#">c</a></li>   
</ul>

Answer 2

如果我是正确的，你应该创建一个活动的类并将其添加到实际的活动列表项。

使用html和css更改活动引导菜单项

2 个答案: