我可以使用jquery删除/否定css！重要规则吗？ [英] Can I use jquery to remove/negate css !important rule?

问题描述

如果有一个使用！important 的CSS规则，是否有一种方法可以删除！important 以便我可以使用JS或jQuery进一步下游样式更改？

theirs.css

  div.stubborn {display：none！important; } 
  

mine.js

  $（'。stubborn'）。fadeIn（）; //不会工作，因为！重要的标志
  

不幸的是，我不能控制风格应用！important 规则，因此我需要一个解决方案。

解决方案

不幸的是，你不能重写！important ，而不使用！important 作为内联/ c> theirs.css 。

您可以定义！important 样式，并将其添加到 .stubborn 然后调整不透明度..

CSS： pre> div.hidden_​​block_el {
display：block！important;
opacity：0;
}


JS： b

  $（'。stubborn'）
 .addClass（'hidden_​​block_el'）
 .animate（{opacity：1}）; 
  

DEMO： http://jsfiddle.net/jjWJT/1/

替代方法（内联），

  $（'。stubborn'）
 .attr（'style'，'display：block！important; opacity：0;'）
 .animate（{opacity：1}）; 
  

DEMO： http://jsfiddle.net/jjWJT/

If there is a CSS rule that uses !important, is there a way to remove the !important rule so that I can make further downstream style changes with JS or jQuery?

theirs.css

div.stubborn { display: none !important; }

mine.js

$('.stubborn').fadeIn();  // won't work because of !important flag

Unfortunately, I do not have control over the style applying the !important rule so I need a work-around.

解决方案

Unfortunately, you cannot override !important without using !important as inline/internal style below the included theirs.css.

You can define a !important style and add it to .stubborn then adjust the opacity.. See below,

CSS:

div.hidden_block_el { 
   display: block !important;
   opacity: 0;
}

JS:

$('.stubborn')
    .addClass('hidden_block_el')
    .animate({opacity: 1});

DEMO: http://jsfiddle.net/jjWJT/1/

Alternate approach (inline),

$('.stubborn')
    .attr('style', 'display: block !important; opacity: 0;')
    .animate({opacity: 1});

DEMO: http://jsfiddle.net/jjWJT/

这篇关于我可以使用jquery删除/否定css！重要规则吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！