Class Selectors in CSS

You can define style rules based on the class attribute of the elements. All the elements having that class will be formatted according to the defined rule.

.black {
   color: #808000;
}

This rule renders the content in black for every element with class attribute set to black in our document. You can make it a bit more particular. For example:

h1.black {
   color: #808000;
}

This rule renders the content in black for only <h1> elements with class attribute set to black.

You can apply more than one class selectors to given element. Consider the following example:

<p class = "center bold">
   This para will be styled by the classes center and bold.
</p>