Html 如何为每个引导导航窗格指定不同的颜色？

我有一个带有两个引导3导航选项卡的html页面：

<!-- Nav tabs 1 -->
<div class="card">
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#foods_week" aria-controls="foods_week" role="tab" data-toggle="tab">This Week</a></li>
<li role="presentation"><a href="#foods_all" aria-controls="foods_all" role="tab" data-toggle="tab">All times</a></li>
</ul>

<!-- Tab panes 1 -->
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="foods_week"> 
       Some text here 
</div>
<div role="tabpanel" class="tab-pane" id="foods_all">
    Lorem Ipsom
</div>

</div>                       
</div>
<!-- ‌END Nav tabs 1 -->


<!-- Nav tabs 2-->
<div class="card">
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#recepies_week" aria-controls="recepies_week" role="tab" data-toggle="tab">This Week</a></li>
<li role="presentation"><a href="#recepies_all" aria-controls="recepies_all" role="tab" data-toggle="tab">All times</a></li>
</ul>

<!-- Tab panes 2-->
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="recepies_week"> 
    Bla blalbla 
</div>
<div role="tabpanel" class="tab-pane" id="recepies_all">
    Long story short...
</div>

</div>                       
</div>
<!-- ‌END Nav tabs 2 -->

我想要的是为导航标签2提供一种不同的颜色：当鼠标悬停在上方时，有红色下划线和红色文本，而不是蓝色

---

我自大地玩css，但无法实现这一点。因此，感谢您的帮助。

只需为每个导航添加其特定的类名或ID即可。例如：

<ul id="nav-one" class="nav nav-tabs" role="tablist"></ul>
<ul id="nav-two" class="nav nav-tabs" role="tablist"></ul>
<ul id="nav-three" class="nav nav-tabs" role="tablist"></ul>

---

将此添加到您的css.card:nth child（2）.nav tabs>li>a:hover{color:red；}

<ul id="nav-one" class="nav nav-tabs" role="tablist"></ul>
<ul id="nav-two" class="nav nav-tabs" role="tablist"></ul>
<ul id="nav-three" class="nav nav-tabs" role="tablist"></ul>

#nav-one.nav-tabs { border-bottom: 2px solid #DDD; }
/* ... */
#nav-two.nav-tabs { border-bottom: 3px solid #CCC; }
/* ... */
#nav-three.nav-tabs { border-bottom: 4px solid #999; }
/* And etc. */