Как отменить важное правило css из бутстрапа
Я пытаюсь установить стиль css display: none; с угловой анимацией для элемента, у которого уже есть класс начальной загрузки .d-block, который устанавливает отображение как .d-block { display: block!important;}.
Как я могу отменить класс .d-block?
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')
])
@Dominik Я не могу контролировать специфику правила CSS, заданного бутстрапом, я могу только установить класс. что означает, что я должен был бы быть более конкретным с моим css в угловой анимации, что я не знаю/думаю, что это возможно.
Очевидно. Вы можете повысить специфичность переопределяющего правила, что я и пытался предложить. Это возможно, поскольку все, что вам нужно, — это более высокая специфичность путем перехода к атрибуту стиля, добавления селектора более высокой специфичности или... еще 100 вещей.
@Dominik, я понимаю, что вы предлагаете, но мой вопрос в том, как я могу это сделать, добавить более высокую специфичность с правилом CSS, которое применяется с помощью угловой анимации?
@Rajat, спасибо, но это не отвечает на мой вопрос, возможно ли придать более высокую специфичность правилу css в угловых анимациях. display: 'none !important' недействителен.
Ответы 1
Я не нашел способа добавить более высокую специфичность в правило css для угловых анимаций, поэтому на данный момент я удалил .d-block и добавил display: block в свой файл css.
Таким образом, обычное правило css отменяется правилом угловой анимации.
Погуглите
specificitycss-tricks.com/specifics-on-css-specificity