I'm trying to find out what is the best practice for naming and casing css classes and ids, especially multiple word names.
So for instance, say I have a <div>
that I want to name "character skills".
It seems like there are 3 choices: "characterskills", "character_skills", or "character-skills".
Which one of these is the industry standard for naming css classes and ids?
What's the best practice for splitting multiple words in css names?
Also is it a best practice to always use all lowercase for css names, because they are case-insensitive?
Conclusion. When you're working with CSS, there are no specific reasons forcing you to use an ID over a class. 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.
The CSS id Selector To select an element with a specific id, write a hash (#) character, followed by the id of the element.
Using Title CSS, you'd do the following: For any global CSS class, use a capitalized name (title case). For any modifier or descendant class, use a lowercase letter for the beginning of th name.
I tend to use the hyphenated style as well. I mainly use that style since CSS properties follow the same casing. Similarly, JavaScript functions and variables tend to use lower camel case. For example, to change a CSS property in JavaScript, you would type object.style.textDecoration
, but in CSS, that property would be changed with text-decoration
.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With