The Class Selector

The class selector selects elements with a specific class attribute. To select elements with a specific class, write a period character, followed by the name of the class:

HTML file: Displayed by browser:
<style>
.center {
    text-align: center;
    color: teal;
}
</style>
<body>
  <h1 class="center">Teal-colored and center-aligned heading.</h1>
  <p class="center">Teal-colored and center-aligned paragraph.</p>
</body>

Teal-colored and center-aligned heading.

Teal-colored and center-aligned paragraph.

In this example, all HTML elements with class="center" will be colored teal and center-aligned.

Back buttonTable of ContentsNext button