我试图覆盖bootstrap中的活动选项卡样式.
我已经设法给标签圆角并通过给<li>标签添加一个新类来改变颜色,所以外观非常好,我想要外观和悬停.然而,活跃的标签固执地保持着引导风格.我已经尝试了各种各样的选择器来获得足够的具体但我现在被卡住了.我看不出如何更具体的活动选择器:
.nav-tabs > li.rounded.active > a,
.nav-tabs > li.rounded.active > a:hover,
.nav-tabs > li.rounded.active > a:focus {
background-color:cadetblue;
font-weight:bolder;
border-top-left-radius:10px;
border-top-right-radius:10px;
}
Run Code Online (Sandbox Code Playgroud)
这是我的HTML:
<ul class="nav nav-tabs">
<li class="rounded"><a href="#">Home</a></li>
<li class="rounded"><a href="#">Bio</a></li>
<li class="rounded"><a href="#">Links</a></li>
<li class="rounded"><a href="#">Gallery</a></li>
</ul>
Run Code Online (Sandbox Code Playgroud)