Skip to content

Latest commit

 

History

History
53 lines (41 loc) · 1.05 KB

12.whats-is-class-and-id.md

File metadata and controls

53 lines (41 loc) · 1.05 KB

12. whats is a class? and what is an id?

ID Attribute

  • ID is an unique selector
  • Same ID name shouldn't be used on another element
  • An element can have only one ID attribute
  • ID has more specificity than a class attribute

Example: index.html

<!-- BAD -->
<body id="main-container">
  <div id="main-container"></div> 
</body>

<!-- GOOD -->
<body>
  <div id="main-container"></div>
</body>

Class Attribute

  • Same Class can be used on more than one element
  • An element can have multiple Classes

Example: index.html

.none {
  display: none;
}

.list {
  padding-left: 10px;
}
<!-- Same class on multiple elements -->
<div id="main-container" class="none">I am DIV element</div>
<span class="none">I am SPAN element</span>

<!-- Multiple classes on multiple elements -->
<ul>
  <li class="list none"></li>
  <li class="list none"></li>
  <li class="list none"></li>
  <li class="list none"></li>
</ul>