Lets say I have a plugin's CSS which loads later as my style.css
/*style.css*/
.something {
position:absolute;
left: 0px !important;
}
/*plugin's CSS*/
.something {
position:absolute;
left: -50px;
}
/now it has 0px but i want no left value at all/
i know i can set !important so that property wont be overriden, but is there any solution to turn "left" off as Chrome DevTools uncheck a property?
As far as I am aware (someone please feel free to correct me) there is no way to directly "turn off" a CSS property like in the Chrome DevTools.
The closest you can get it to reset the property to its default. In your example, it would be "left:auto;"
P.S. You may wish to adjust your tags to get more views and hopefully answers.
You should use the "auto" value for left:
.something
{
position:absolute;
left:auto !important;
}
"auto" will reset to the default (that is set by browsers for that style)
more info here: http://www.w3schools.com/cssref/pr_pos_left.asp
Specificity is the key to selecting the CSS attribute that you really want. Leverage the specific structure of the HTML in the plugin vs. non-plugin case so that specificity rules select the CSS you desire when plugin rules should apply.
There's a great overview of specificity here:
Source: http://www.stuffandnonsense.co.uk/archives/css_specificity_wars.html
One thought that comes to mind is to use an additional class, plugin, along with an appropriate selector.
If you are trying to override it then you can play with CSS Specificity Rules
来源:https://stackoverflow.com/questions/11939519/turn-off-css-property