What's the difference in saying
#mainlevel-nav a:hover {
text-decoration: none;
}
and saying
.mainlevel-nav a:hover {
text-decoration: none;
}
And how come some classes have periods in front of them and some don't?
Sorry for the noob questions.Okay, I found a website to answer my question:
Class Selector - .[Class Name] - Matches elements with CLASS attributes carrying a [Class Name] value.
ID Selector - #[ID Name] - Matches the element carrying the unique ID attribute value of [ID Name].
So now my next question is: what's the difference? and when do you use one and when do you use the other?First question: the hash refers to an elements id, the period refers to an elements class, if there were niether, it'd refer to an element.
Second question: when refering to an elements class, a period is always used; when declaring an elements class, a period is never used.
Edit Crud buckets, I never saw your second post. An id is unique, it can only be used once. A class gets used lots of times, and an element have a selection of classes.the tree, thanks for the quick reply.
Regarding the second answer: Can you "dumb" that down a little for me?
I'm fairly new to css, only really using it for basic font styling, so really don't know the difference or when/why you would use one vs. the other.
thanks again!An id is unique, it can only be used once. A class gets used lots of times, and an element have a selection of classes. Example:<ul id="navigation">
<li id="active"><a href=http://www.webdeveloper.com/forum/archive/index.php/"page.htm">Home</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"page.htm">Catorgries</a></li>
<li class="newcontent"><a href=http://www.webdeveloper.com/forum/archive/index.php/"page.htm">Projects</a></li>
<li class="unimportant"><a href=http://www.webdeveloper.com/forum/archive/index.php/"page.htm">Archives</a></li>
<li class="unimportant"><a href=http://www.webdeveloper.com/forum/archive/index.php/"page.htm">Contact</a></li>
<li class="unimportant newcontent"><a href=http://www.webdeveloper.com/forum/archive/index.php/"page.htm">FAQ</a></li>
</ul>class="new content" This is a multiple class, 'new' and ''content'
class="unimportant" class="newcontent" Only 1 of these will be applied depending on the browser.
Use a multiple class: class="unimportant newcontent"
A useful tutorial is: <!-- m --><a class="postlink" href="http://www.brainjar.com/css/using/">http://www.brainjar.com/css/using/</a><!-- m -->
Warning: some of the patterns show are not fully supported in all browsers. Check support (<!-- m --><a class="postlink" href="http://www.csscreator.com/attributes/">http://www.csscreator.com/attributes/</a><!-- m -->) before using.Wow, I sure am ignorant, will edit post.
Thanks for that fang.Browsers, when applying the style to a page, treat IDs and classes the same. You can give more than one HTML tag the same ID and the browser will apply the styles for that ID to each tag. The W3's HTML validator (<!-- m --><a class="postlink" href="http://validator.w3.org/">http://validator.w3.org/</a><!-- m -->) will give you an error if an ID is on a page more than once. And if you get into DHTML and use the document.getElementById method to grab a reference to an HTML tag, you'll get a JavaScript error if you try to use an ID that's on the page more than once.Read the tutorial, it's a bit heavy going for n00bs, but it covers the essentials.toicontien IE can reference multiple ID's (with the same value) as a collection. Gecko is going to build in the same functionality albeit switchable.
Strange. I thought getting a collection of elements was best suited for using classes and the document.getElementsByClassName method. At least I think that's the method, right off hand.
#mainlevel-nav a:hover {
text-decoration: none;
}
and saying
.mainlevel-nav a:hover {
text-decoration: none;
}
And how come some classes have periods in front of them and some don't?
Sorry for the noob questions.Okay, I found a website to answer my question:
Class Selector - .[Class Name] - Matches elements with CLASS attributes carrying a [Class Name] value.
ID Selector - #[ID Name] - Matches the element carrying the unique ID attribute value of [ID Name].
So now my next question is: what's the difference? and when do you use one and when do you use the other?First question: the hash refers to an elements id, the period refers to an elements class, if there were niether, it'd refer to an element.
Second question: when refering to an elements class, a period is always used; when declaring an elements class, a period is never used.
Edit Crud buckets, I never saw your second post. An id is unique, it can only be used once. A class gets used lots of times, and an element have a selection of classes.the tree, thanks for the quick reply.
Regarding the second answer: Can you "dumb" that down a little for me?
I'm fairly new to css, only really using it for basic font styling, so really don't know the difference or when/why you would use one vs. the other.thanks again!An id is unique, it can only be used once. A class gets used lots of times, and an element have a selection of classes. Example:<ul id="navigation">
<li id="active"><a href=http://www.webdeveloper.com/forum/archive/index.php/"page.htm">Home</a></li>
<li><a href=http://www.webdeveloper.com/forum/archive/index.php/"page.htm">Catorgries</a></li>
<li class="newcontent"><a href=http://www.webdeveloper.com/forum/archive/index.php/"page.htm">Projects</a></li>
<li class="unimportant"><a href=http://www.webdeveloper.com/forum/archive/index.php/"page.htm">Archives</a></li>
<li class="unimportant"><a href=http://www.webdeveloper.com/forum/archive/index.php/"page.htm">Contact</a></li>
<li class="unimportant newcontent"><a href=http://www.webdeveloper.com/forum/archive/index.php/"page.htm">FAQ</a></li>
</ul>class="new content" This is a multiple class, 'new' and ''content'
class="unimportant" class="newcontent" Only 1 of these will be applied depending on the browser.
Use a multiple class: class="unimportant newcontent"
A useful tutorial is: <!-- m --><a class="postlink" href="http://www.brainjar.com/css/using/">http://www.brainjar.com/css/using/</a><!-- m -->
Warning: some of the patterns show are not fully supported in all browsers. Check support (<!-- m --><a class="postlink" href="http://www.csscreator.com/attributes/">http://www.csscreator.com/attributes/</a><!-- m -->) before using.Wow, I sure am ignorant, will edit post.
Thanks for that fang.Browsers, when applying the style to a page, treat IDs and classes the same. You can give more than one HTML tag the same ID and the browser will apply the styles for that ID to each tag. The W3's HTML validator (<!-- m --><a class="postlink" href="http://validator.w3.org/">http://validator.w3.org/</a><!-- m -->) will give you an error if an ID is on a page more than once. And if you get into DHTML and use the document.getElementById method to grab a reference to an HTML tag, you'll get a JavaScript error if you try to use an ID that's on the page more than once.Read the tutorial, it's a bit heavy going for n00bs, but it covers the essentials.toicontien IE can reference multiple ID's (with the same value) as a collection. Gecko is going to build in the same functionality albeit switchable.
Strange. I thought getting a collection of elements was best suited for using classes and the document.getElementsByClassName method. At least I think that's the method, right off hand.