javascript - Angular UI - ui-select 自定义样式

Question

所以我使用 ui-select 和 angularjs 来创建一个可配置的指令。后端的功能几乎完成，但我们的原型(prototype)具有非常具体的样式，我需要遵守这些样式。

我想按照我认为合适的方式简单地重新设置 ui-select 的样式，但我似乎无法在网上找到有关如何这样做的单个教程。我找到了一些关于使用 $templateCache 覆盖 angular ui 使用的模板的示例。有没有办法简单地在它使用的某个地方放置一个 css 文件而不是默认文件？或者有没有办法在没有一堆 !important 标签的情况下覆盖当前类。

Answer 1

当然，您可以通过我们自己的 CSS 更改 UI-select 指令的整个样式。对此没有限制，请查看 link 中的示例 CSS 更改。 .

.ui-select-container {
  width:  200px;
}
.ui-select-bootstrap .ui-select-choices-row.active>a {
  background: #000;
  color: #fff;
}
.ui-select-container input {
    border: none;
    border-bottom: 1px solid #ccc;
    box-shadow: none;
}