hello everyone!!!
what is the difference between this two css
p {
color : red;
}
.name p {
color : blue;
}how do i call this two css so that i can have a two results of p? one is color red and the other is blue.
your help is highly appreciated!!!
thanks in advanced!!!
Jump to PostThe difference is the following:
p {} only is a master declaration for your whole page. Definitions here will be inherited by all p tags by default. It is like a default style for p tags.
.name p {} can be used to change the default setting to …
Jump to PostOn a similar note, if you have something like #nav p then it will only do that when it <p> tags are encountered in the <div> section with the ID "nav".
Jump to PostThe first one sets the defaukt colour for all <p> elements to red. The second one, overrides this to green, but only for <p> elements in the #nav did.
#nav p h1 wont do anything but #nav p, h1 will. That will override the colour property for both <p> …
The difference is the following:
p {} only is a master declaration for your whole page. Definitions here will be inherited by all p tags by default. It is like a default style for p tags.
.name p {} can be used to change the default setting to something else, which will have priority over the default declaration. Note that .name is a class in CSS, so you can reuse it several times, while #name is specific ID in you html code that you want explicitly to modify by css.
For example, if you are building up a forum, you can specify that all p tags by default show in red.
However, each post which is e.g. div, containing some p in it needs to be blue. So it will look like this
<body>
<p>All these will be shown in red</p>
<div class="posts" ><p>My blue content here</p></div>
</body>But if you want some special formatting do be applied on a specific section of your page only - e.g. header, footer, news, etc..., you should do it like this.
<body>
<p>All these will be shown in red</p>
<div class="posts" ><p>My blue content here</p></div>
<div id="sections_unique_name_here"><p>Only this here will be purple</p></div>
</body>Note that classes (.name) can appear on a single page multiple times, while id's (#name) can appear on a single page ONLY ONCE!
HELLO RHYAN, thanks a lot.....
thank you so much......
On a similar note, if you have something like #nav p then it will only do that when it <p> tags are encountered in the <div> section with the ID "nav".
thanks to all info... thanks a lot,
i hope you can still help me with this one...
#nav p h1 {
color : red;
}how can i call this one...?
thanks a lot!!!
thanks to all info... thanks a lot,
i hope you can still help me with this one...
p {
color : red;
}
#nav p {
color : green;
}
#nav p h1 {
color : red;
}how can i call this three and their differences...?
thanks a lot!!!
The first one sets the defaukt colour for all <p> elements to red. The second one, overrides this to green, but only for <p> elements in the #nav did.
#nav p h1 wont do anything but #nav p, h1 will. That will override the colour property for both <p> and <h1> tags in the nav section to be red.
Just one thing - <p></p> elements are not allowed to contain h1-h6 elements.
This means you cannot have the following <p><h1>Heading Here</h1>The other text being here</p>
They are in HTML transitional , just not in XHTML.
thanks everyone!!!
for my last questions,,, how do i call this one and their difference/s
#search-news {
float: right;
width: 140px;
}
#search-news div {
padding: 3px 0;
margin: 0;
}thanks a lot!!!
well to me it seems like that its another div with name search-news div. while the first div's name is search-news. it seems like two different divs. and the styles are applied on each one individually they are not connected anyhow.
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.