css - 想覆盖 Bootstrap，但如何避免使用 !important？

Question

我正在使用 Bootstrap 并想覆盖一些 css:当处于禁用状态时，我正在删除表单字段中的背景、边框和不允许的指针。

这是我的 CSS 的样子:

.no-extras {
  border: 0 !important;
  box-shadow: none !important;
  background-color: white !important;
  cursor: default !important;
}

但我知道使用 !important 是一件坏事。但是我应该如何更改代码以避免使用 !important？我试图用“input.no-extras”和类似的东西让它更具体，但到目前为止还没有任何运气......

请在此处查看示例代码 http://plnkr.co/edit/1AuszJ?p=preview

Answer 1

您仅在 .form-group 中添加 .no-extras 因此您可以使用:

.form-group .no-extras {
    border: 0;
    box-shadow: none;
    background-color: red;
    cursor: default;
}

Plunker

或者您可以使用任何其他父类。