如何覆盖 bootstrap 中的 !important css 规则

Question

我正在尝试将带有 angular 动画的 css 样式 display: none; 设置到已经具有 bootstrap class [=14] 的元素=]，将显示设置为 .d-block { display: block!important;}。我怎样才能否决 .d-block class ？

  trigger('fade', [
    state('hidden', style({
      opacity: 0,
      display: 'none'
    })),
    state('show', style({
      opacity: 1,
      display: 'block'
    })),
    transition('hidden => show', [
      animate('1s')
    ]),
    transition('show => hidden', [
      animate('1s')
    ])

Answer 1

我还没有找到在 angular 动画 css 规则中添加更高特异性的方法，所以暂时我删除了 .d-block 并添加了 display: block我的 css 文件。

这样正常的 css 规则被 angular 动画规则否决了。

如何覆盖 bootstrap 中的 !important css 规则

How to overrule !important css rule from bootstrap

css

angular

twitter-bootstrap

angular-animations