在 ngx-bootstrap 中自定义选项卡

Pun*_*nit 2 twitter-bootstrap-3 bootstrap-4 ngx-bootstrap angular

我正在尝试将自定义样式添加到 ngx-bootstrap 的选项卡中以获取角度。我想要两件事 1) 删除边框线和 2) 将背景颜色设置为活动选项卡。

但似乎没有任何效果

HTML代码

div >
<tabset>
   <tab customClass="customClass" heading="Home"></tab>
   <tab heading="Profile"></tab>
   <tab heading="About us"></tab>
</tabset>
</div>
Run Code Online (Sandbox Code Playgroud)

CSS 代码

.customClass > a{
background-color:silver !important;
border-bottom: none !important;
outline: 0 !important; 
}

tab>active{
color:rgb(58, 45, 128)
}
Run Code Online (Sandbox Code Playgroud)

什么可能是解决方案???

yur*_*zui 5

尝试添加encapsulation: ViewEncapsulation.None到您的组件元数据或使用::ng-deep前缀

::ng-deep .customClass > a {
}
Run Code Online (Sandbox Code Playgroud)

Stackblitz 示例