Override definition in css file
There is no easy way to do this.
There are some common tricks to simulate this behavior. The best one to use will differ depending on how complex the overridden scope is and how often you want to do it.
Method 1 (for simple overrides):
Add an additional class definition to the statement, similar to where you clear the default style (e.g. discussed at http://www.wordpress.darfuria.com/blog/clear-css-defaults ). You may need to arrange declarations so that prevent the priority of the "normal" style.
.override {/*Your default style overrides, color: white;
margin: 0; background:none; etc */}
<p class="override">foo</p>
Method 2 (awkward but good for tricky areas):
Use an iframe to pull the entire area from a separate .html file hosted elsewhere on your site. The content inside iframes matches the CSS page of the page within the frame and usually ignores the CSS from the adjacent page.
Method 3 (suitable for one-time override):
Use inline styles as described here.
Edit: Not really a method, but probably the most correct way
Also, maybe not what you want to hear
Think about how you organized your classes.
For example:
If the overridden is <p>
special in some way, it probably deserves a class of its own that describes what that purpose is. <p class='override'>
doesn't help people who will look at your design after you're done, as it doesn't tell them what the overridden text is or why it styled that way.
Are the overrides in a specific region? If so, then a style definition like this div.left_nav p {/*styles*/}
might be better.
Finally, Is the default style <p>
non-standard default? Perhaps more correctly specified style of p could be okay, with additional definitions p.foo
and so p.bar
on.
This doesn't fix your immediate problem, but it might be worth chewing on before you start your next project.
source to share
Just to check. For all the talk about default styles, if you style for an element type in a CSS file like: -
li {...}
Then you also include the css file containing the class definition and apply that class to a separate instance of that element type, e.g .: -
<li class="myLiClass">Some Text</li>
From what I understand, it is not possible to get a class myLiClass
to override any " li {...}
" style specification attribute for an element by providing this overriding style in the css class.
So I claim that this means: -
"If you specify a style attribute for any type of html element (element type, not class) in a css file, then all pages that use that css file cannot show that element type attribute using any other style where this style looks like as a css class.
Can anyone confirm this with an absolute yes or a working example of why this statement is not true.
source to share
You can style your tag from your stylesheet like this:
CSS
p.first{ color: blue; }
p.second{ color: red; }
Html
<html>
<body>
<p>This is a normal paragraph.</p>
<p class="first">This is a paragraph that uses the p.first CSS code!</p>
<p class="second">This is a paragraph that uses the p.second CSS code!</p>
</body>
</html>
source to share
I agree that there is no "default" style for the tag, as every browser has considerable freedom in how to display it.
I think the simplest answer is to rethink the problem - define the class you use for all P tags and then if you can't use the class it will give you the default style.
<style>
p.all {margin.top:9px;}
</style>
<p>This would be default style</p>
<p class="all">This would have your style</p>
Alternatively, if you have wrapped all your styled content in a div or some other tag, you can nest styles like this:
<style>
div.foo p{border:1px solid black;}
</style>
<p>normal</p>
<div class="foo">
<p>abnormal</p>
</div>
Hope it helps.
source to share
What makes it impossible is that there is no default style.
The default styles are taken from the browser's internal stylesheet and user preferences. Therefore, different browsers and different users have different defaults.
You can assume that white / transparent background, black foreground and Arial font will be most of the default styles for people, but you cannot be sure.
So, as other people say, you have a fundamental problem because you have a style for all P elements, and there is no way to code a P that does not inherit from that style, ride it with more specific CSS.
source to share