Reputation: 339
Is there a way or operator in CSS to assign a new style to specific element? I don't want to change original style because it belongs to a plugin and changing it will change it on all my pages. However I want to change the position of the element on a specific web page.
I also can't call those styles in my html because that CSS file is used solely in jquery plugin, you only put class="slideshow"
in html div
and thats that. I can change that CSS file to suit my preferences, however I don't know how to change it for specific instances?
Upvotes: 1
Views: 141
Reputation: 10265
In your scenario CSS specificity Rule will be helpful for you.
For example in your plugin you are using RED Font Color
in class slideshow
. Then in your another CSS file you can create a more specific Rule.
Check the Demo what I've posted above on comments section. Here is the direct link.
div.slider .slideshow {color:green;}
Upvotes: 2
Reputation: 465
You can add !important to your css if you wish it to override any inline styles. So long as you make a style sheet specifically for that page, this should work for what you need. Hope this helps :)
Upvotes: 1
Reputation: 103750
In order to make a specific styling on a specific instance of your plugin, you should assign a specific class or id to a parent container of that plugin for the instance you need customization.
Example : you can give the id="special"
to a parent of the plugin in the page you want customization.
Then you can use that selector to style it independently from other instances of that same plugin.
example CSS:
#special .slideshow /*other selectors */ {
/*your specific style */
}
Upvotes: 2
Reputation: 2522
You can refer to the element by name:
#htmlitemname{
color: green;
}
CSS is cascading, i.e. it will apply it top down - general, class and then the id.
Upvotes: 1