css - AngularJS UI bootstrap : How to modify uib-tab CSS

我正在使用UI Bootstrap选项卡，并且我想更改某些组件的CSS，但是不确定如何正确访问不同的元素。

我要更改的元素是事件选项卡的文本，非事件选项卡的文本以及两者的边框。

在CSS中访问这些标签的正确语法是什么？

这是我正在使用的uib标签HTML:

<uib-tabset>

    <uib-tab heading="Episodes"></uib-tab>

  <uib-tab heading="Categories"></uib-tab>

</uib-tabset>

我对CSS很陌生-提前致歉...

最佳答案

您可以简单地为.nav-tabs编辑bootstrap的css

.nav-tabs > li > a {
    border: 1px solid #000;
}

对于事件的标签

.nav-tabs > li.active > a {
    /*CSS HERE*/
}

(可选)您可以设置Angular添加的uib-tab类的样式:

.uib-tab a {
    border: 1px solid #000;
  }

对于事件 uib选项卡

.uib-tab.active a {
    /*CSS HERE*/
}