Thank you so much for the resource. It gave me the larger context that IDs and classes exist within. IDs are usually used when you need to reference that element in JavaScript, so if you were looking to fade out a div when a button is clicked the div and button would get IDs instead of classes. So I use IDs for reference and classes for styling I'm almost sure IDs have more specificity in css than classes do, but don't quote me on that right now Using jQuery allows for selection by class, tag, and more.
In your example, you could use classes like "js-fade-trigger" and "js-fade-out" and reference them from JavaScript using jQuery. I recommend only using ID's for unique identification of elements on the page when it's required. I believe you're right about the specificity of ID's, though. Another good reason to avoid using them for styling. Posting to the forum is only allowed for members with active accounts. Please sign in or sign up to post. Welcome to the Treehouse Community The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support.
In the browser, classes have no special function. Their main purpose is to allow you to apply styles to a range of elements on a web page. IDs, on the other hand, can be used by the browser to navigate to a certain part of the web page. This behavior works because IDs are unique on a web page.
Suppose we wanted to send over a link to our website that scrolls the user automatically to a header. We could do so using this code:. Now, we could send a user a direct link that scrolls them to that element on the web page.
This is done by using the following URL:. When a user navigates to this URL, where domain. This behavior does not apply to classes. The function getElementById allows you to select an element on a web page. It relies on the fact that only one element can share the same ID. Classes, on the other hand, can reflect multiple elements on a web page. They would not be useful if you want to work with a particular element in JavaScript.
Two months after graduating, I found my dream job that aligned with my values and goals in life! You could do so using this code:. However, it is best practice to only use IDs if you want a style to apply to one element on the web page, and to use classes if you want a style to apply to multiple elements.
In this tutorial, we discussed, with reference to examples, the basics of the CSS ID and class selectors, and we compared and contrasted the two. About us: Career Karma is a platform designed to help job seekers find, research, and connect with job training programs to advance their careers. Learn about the CK publication.
James Gallagher is a self-taught programmer and the technical content manager at Career Karma. James has written hundreds of programming tutorials, and he frequently contributes to publications like Codecademy, Treehouse, Repl. He also serves as a researcher at Career Karma, publishing comprehensive reports on the bootcamp market.
Read more by James Gallagher. With help from Career Karma, you can find a training program that meets your needs and will set you up for a long-term, well-paid career in tech.
Find the right bootcamp for you. It will identify the unique element of your entire page. No other element should be declared with the same id. The id selector is used to specify a style for a single, unique element. The id selector uses the id attribute of the HTML element, and is defined with a " ".
The class selector is used to specify a style for a group of elements. Unlike the id selector, the class selector is most often used on several elements. If there is something to add to the previous good answers, it is to explain why id s must be unique per page. This is important to understand for a beginner because applying the same id to multiple elements within the same page will not trigger any error and rather has the same effects as a class.
But from the JavaScript perspective, it is important to have one id per element per page because getElementById identifies, as its name suggests, elements by their id s. You can assign a class to many elements. You can also assign more than one class to an element, eg. You can assign the id only to one. So if you want to make many elements look the same, eg. If you want to trigger certain actions on an element using JavaScript you will probably use id. A class can be used several times, while an ID can only be used once, so you should use classes for items that you know you're going to use a lot.
An example would be if you wanted to give all the paragraphs on your webpage the same styling, you would use classes. Standards specify that any given ID name can only be referenced once within a page or document. Use IDs when there is only one occurence per page. Use classes when there are one or more occurences per page. Content is a class since it'll probably apply to some other tags aswell where as "veryImportant" is only being used once and never again. This allows you to set a particular style for many HTML elements with the same class.
The class selector uses the HTML class attribute, and is defined with a ". The "unique" only means one element can not have more than one id attributes like class selector.
Stack Overflow for Teams — Collaborate and share knowledge with a private group. Create a free Team What is Teams? Collectives on Stack Overflow. Learn more. What is the difference between id and class in CSS, and when should I use them? Asked 9 years, 1 month ago. Active 1 year, 8 months ago. Viewed k times. Improve this question. Aryan Beezadhur 2, 1 1 gold badge 13 13 silver badges 36 36 bronze badges. Possible duplicate, stackoverflow. Id stands for identity primary and class is secondary.
This shouldn't have marked duplicate as author has asked "
0コメント