css - 覆盖组件自动生成的子级 css； Angular

Question

在 Angular 中，有一个 ui-select为其视觉生成跨度的组件:

如您所见，此跨度具有自动分配的“.btn”css 类，它将组件着色为特定颜色 - 应用程序中所有类型按钮的颜色。

我需要的是通过下拉菜单覆盖它而不是一个按钮，因此它不需要看起来像一个按钮。

为了覆盖它，我已将“search_drop”类分配给具有 !important 属性的父 div，如您所见。

“search_drop”的 CSS 定义是:

.search_drop {
    font-family: HPSimplified, Arial !important;
    color: black;
    background: none !important;
}

结果是一样的。

请问您能否建议如何覆盖 span 的样式？ .btn css 类需要保持不变。

谢谢!

Answer 1

尝试

.search_drop .ui-select-match .btn {
    font-family: HPSimplified, Arial !important;
    color: black;
    background: none !important;
}

以获得正确的特异性水平。

这只会影响 ui-select 组件中的 .btn 类