Javascript 我可以使用 jquery 删除/否定 css !important 规则吗？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11890739/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Can I use jquery to remove/negate css !important rule?
提问by doub1eHyman
If there is a CSS rule that uses !important, is there a way to remove the !importantrule so that I can make further downstream style changes with JS or jQuery?
如果有使用 的 CSS 规则，!important有没有办法删除该!important规则，以便我可以使用 JS 或 jQuery 进行进一步的下游样式更改？
theirs.css
他们的.css
div.stubborn { display: none !important; }
mine.js
我的.js
$('.stubborn').fadeIn(); // won't work because of !important flag
Unfortunately, I do not have control over the style applying the !importantrule so I need a work-around.
不幸的是，我无法控制应用!important规则的样式，所以我需要一个解决方法。
采纳答案by Selvakumar Arumugam
Unfortunately, you cannot override !importantwithout using !importantas inline/internal style below the included theirs.css.
不幸的是，如果!important不使用!important包含的theirs.css.
You can define a !importantstyle and add it to .stubbornthen adjust the opacity.. See below,
您可以定义!important样式并将其添加到.stubborn然后调整不透明度..见下文，
CSS:
CSS：
div.hidden_block_el {
display: block !important;
opacity: 0;
}
JS:
JS：
$('.stubborn')
.addClass('hidden_block_el')
.animate({opacity: 1});
DEMO:http://jsfiddle.net/jjWJT/1/
演示：http : //jsfiddle.net/jjWJT/1/
Alternate approach (inline),
替代方法（内联），
$('.stubborn')
.attr('style', 'display: block !important; opacity: 0;')
.animate({opacity: 1});
回答by Mark Pieszak - Trilon.io
Just add a style=""tag to any images with this issue, hopefully they all have some sort of defining class to them that it's easy to do so.
只需style=""为有此问题的任何图像添加一个标签，希望它们都有某种定义类，这很容易做到。
$('div.stubborn').attr('style', 'display: inline !important;');?
回答by Oswaldo Acauan
You need to create a new class to apply fade.
您需要创建一个新类来应用淡入淡出。
CSS:
CSS：
div.stubborn { display: none !important; }
div.stubborn.fade-ready { display: block !important; opacity: 0; }
JS:
JS：
$('.stubborn').addClass('fade-ready').animate({opacity: 1}); //to show
$('.stubborn').fadeOut(function() {$(this).removeClass('fade-ready');}); //to hide
DEMO HERE
演示在这里
回答by MCurbelo
I have tried several methods, but the best results I've obtained by adding the CSS style (!important) in a separate class, then remove with jQuery:
我尝试了几种方法，但通过在单独的类中添加 CSS 样式 (!important)，然后使用 jQuery 删除，我获得了最好的结果：
CSS:
CSS：
.important-css-here { display: block !important;}
In jQuery:
在 jQuery 中：
$("#selector").addClass("important-css-here");
then, when I need:
然后，当我需要时：
$("#selector").removeClass("important-css-here");
work like a charm ;-)
像魅力一样工作;-)
回答by Scott Selby
you can add a new css style with the !important added to it that will override the original style
您可以添加一个新的 css 样式，并添加 !important 以覆盖原始样式
This is from another answer in javascript:
这是来自javascript中的另一个答案：
function addNewStyle(newStyle) {
var styleElement = document.getElementById('styles_js');
if (!styleElement) {
styleElement = document.createElement('style');
styleElement.type = 'text/css';
styleElement.id = 'styles_js';
document.getElementsByTagName('head')[0].appendChild(styleElement);
}
styleElement.appendChild(document.createTextNode(newStyle));
}
addNewStyle('td.EvenRow a {display:inline !important;}')
this answer is here
这个答案在这里
Also I believe that you can add styling like this
我也相信你可以添加这样的样式
.css({ 'display' : 'block !important' });
in jQuery
在 jQuery 中
