freeCodeCamp/guide/english/css/selectors/attribute/class/index.md

1.2 KiB

title
Class

Class

The CSS “class” selector is used to apply the same styling to multiple elements on the page. A great way to think of this would be like the blueprint of a car or building. The blueprint will allow you to build several cars or several buildings in the same manner after designing the actual layout once.

Use Cases

Unlike the CSS “ID” class names are not unique. Therefore, it is fine for you to use a “class” several times if you would like for these elements to have the same styling applied. In fact, this would be a great time for you to use a “class.” If you would like for three “div” elements in your HTML to have a blue background you could use a class once in your CSS as seen in the example below.

<html>
<style>
  .blueBg {
    background-color: blue;
  }
</style>
  <body>
    <div class="blueBg"></div>
    <div class="blueBg"></div>
    <div class="blueBg"></div>
  </body>
</html>

More Information:

If you would like to learn more information on the CSS “class” selector please visit this page