Where can i use id and classes. What is the difference between them. IS there any need that we should compulsorily use ids in our css?
views:
225answers:
6
+4
Q:
What is the difference between Classes and IDs in CSS? Explain me with example of where to use
+13
A:
IDs are meant to be unique, while classes are better for a "type" of element.
So you might have something like:
<ul id="menu">
....
</ul>
Because you will probably only have 1 main menu on your site.
For classes, however, you might have something like:
<span class='author'>Paolo Bergantino</span>
Or perhaps to style the div that contains an answer on this site:
<div class='answer'>....</div>
Because there will be multiple of these per page, they are a class of elements. Think of an ID as the social security number of an element. Whenever an element is important enough and is unique, you give it an ID. This also helps with dynamic websites as selecting elements by ID is by far the fastest way, and if you have multiple elements with the same ID (thus violating this practice) Javascript won't work as intended.
Paolo Bergantino
2009-08-01 01:48:17
+1
A:
From the w3schools:
The id attribute specifies a unique id for an HTML element.
The id must be unique within the HTML document.
The id attribute can be used by a JavaScript (via the HTML DOM) or by CSS to make changes or style the element with the specified id.
and
The class attribute specifies a classname for an element.
The class attribute is mostly used to point to a class in a style sheet. However, it can also be used by a JavaScript (via the HTML DOM) to make changes to HTML elements with a specified class.
The class attribute cannot be used in the following HTML elements: base, head, html, meta, param, script, style, and title.
It is possible to assign multiple classes to one HTML element, e.g. . This allows you to combine several CSS classes for one HTML element.
eKek0
2009-08-01 01:55:49
A:
An ID refers to a specific element (every ID should never used more than once); a class refers to multiple elements.
Steve Harrison
2009-08-01 01:56:44
+1
A:
While you could use classes for everything, the separation between "classes that only occur once" (i.e. IDs) and "regular classes" is quite useful for keeping your CSS meaningful for yourself.
.menu { ... } /* Err, how many of those did I have? */
#menu { ... } /* Ahh, THE menu. */
deceze
2009-08-01 01:57:42
+6
A:
An ID identifies exactly one DOM element, uniquely. A class identifies a group of related DOM elements.
For example, you might have a single, unique nav menu, identified by an ID:
<div id="nav">...</div>
and within it have a number of menu sets, each of which is also uniquely identified and which belongs to a common class:
<div id="nav">
<ul id="content_menu" class="menu">...</ul>
<ul id="contact_menu" class="menu">...</ul>
<ul id="personal_menu" class="menu">...</ul>
</div>
chaos
2009-08-01 01:58:06
+3
A:
Short and simple:
Classes may be used as many times as needed (and are defined by a period). Ids can only be used on ONE element (and are defined by a pound).
<style>
.class {
font-size: 3em;
}
#id {
font-size: 3em;
}
</style>
<body>
<span class="class">I am a class</span>
<span class="class">Look at me, also a class</span>
<span id="id">I am special, you can only have one of me or I do not meet XHTML standards</span>
Tom
2009-08-01 02:16:25
gud example, nice and thanks
Rajasekar
2009-08-01 02:28:50