如何覆盖PrimeNG的<p-accordion>标签默认样式

Question

下面是我的html代码片段。我正在尝试显示一个带有标签标题的选项卡作为Users，但accordion标签始终显示下划线。

<div class="ui-g">
<p-accordion id="tabsHeader">
<p-accordionTab>
<p-header>
<span>Users</span>
</p-header>
</p-accordionTab>
</p-accordion>
</div>

我尝试text-decoration属性设置放在相应的 css 文件中none但这没有帮助，并且始终显示带下划线的标题。

#tabsHeader{
text-decoration : none; 
}

需要有关如何更改默认样式(在本例中为带下划线的文本(的一些帮助。谢谢。

Answer 1

伙计们，你想覆盖NG-PRIME插件的CSS属性吗？

step 1 :
Add in "encapsulation: ViewEncapsulation.None" in respective component and import the 
`ViewEncapsulation in @angular/core.`
step2 : in Style.css
.ui-accordion .ui-accordion-header a {
display: block;
padding: .5em;
}
step 3 : in respective component css file
.ui-accordion .ui-accordion-header a {
display: block;
padding: .5em;
text-decoration-line: none !important;
}

Answer 2

我正在使用更改任何 Primeng 组件的样式

：主机/深/

您可以像这样删除下划线。

组件.scss

:host /deep/ .ui-accordion .ui-accordion-header:hover a{
text-decoration: none ;
}