Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Chris Nelson
4,978 PointsClass or ID - What is the functional difference?
After going through some CSS exercises both here in Treehouse and other sources, I'm not quite clear on the functional difference(s) between a class or an id. I know that 'class' in the HTML is referenced by a '.' in CSS and 'id' is referenced by a '#'. So far, however, I'm not seeing what 'class' does differently from 'id' or vice versa.
6 Answers
Wayne Priestley
19,579 PointsHi Chris,
You can use a class name as many times as you wish on your page, id is unique and an id name can only be used once.
Also, you use id to reference other items on a page when using things like modals or carrousels etc.
Chris Nelson
4,978 PointsOkay, thanks. So, class can be referenced as many times as I want on a page.
And id can be used only once per page, and it can reference more types of items than classes can.
Did I understand correctly? Is there a chart somewhere of the types of items that can be referenced with id vs class?
Valery Kukatov
6,996 Pointshttp://www.w3schools.com/css/css_id_class.asp This explains more or less what the difference is. Really all you need to know is ID can be used once and CLASS can be used many times.
Chris Nelson
4,978 PointsOkay, thanks. So, class can be referenced as many times as I want on a page.
And id can be used only once per page, and it can reference more types of items than classes can.
Did I understand correctly? Is there a chart somewhere of the types of items that can be referenced with id vs class?
Wayne Priestley
19,579 PointsI don't know of any chart as such but an example would be,
If you had a carousel that had ten slides in, each of those slides would have a unique id as a identifier, those id's you would include in your carousel html.
Class is much more a general identifier, meaning if you used the term lead as a class in every other p tag, you could then use css to give all p tags with a class of lead larger font size and a different colour for example. If you tried to do this with an id it would only be possible to style one p tag using id with the name lead.
Chris Nelson
4,978 PointsThanks all. This is helpful. :)
James Barnett
39,199 PointsClasses and IDs can be applied to the same things.
The only difference is with IDs they can only be used once per page and they have a much higher specificity.
Quite a few smart people suggest not using IDs for styling.
Matt Campbell
9,767 PointsI only ever use ID when needing to identify one unique element using jQuery. Rest of the time it's all classes even if I only use that class once.