[英]Styling Bootstrap Tabs individually
我正在使用Bootstrap选项卡,并且想知道分别识别选项卡的最佳方法是什么,以便我可以对它们进行样式设置-例如,以便有一个蓝色选项卡和一个红色选项卡,而不是看起来相同的两个选项卡。
这是仅用于选项卡的HTML :(注意:我也正在使用react。)
<ul className="nav nav-tabs">
<li className="active"><a data-toggle="tab" href="#menu1">This is the headline of one article</a></li>
<li className="tab"><a data-toggle="tab" href="#menu2">Menu 2</a></li>
</ul>
这是到目前为止的CSS:
.nav-tabs>li>a {
background-color: #3999C9;
color:red;
font-family:Fira Sans;
}
.nav-tabs {
font-family:Fira Sans;
border-bottom: 1px solid #10122B;
}
没那么多,哈哈。 欣赏任何提示,无论是在某个地方或其他任何地方添加类。
好吧,只需要使用CSS选择器:
.nav-tabs li:nth-of-type(1) a { ... } // first tab
.nav-tabs li:nth-of-type(2) a { ... } // 2nd
.nav-tabs li:nth-of-type(3) a { ... } // etc
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.