Class Selector

Another commonly used selector is the class selector. Imagine the following code:

<h1 class="title-class">Title</h1>

This code contains an h1 element with the class attribute set to title-class. We say that this element has the class title-class.

In CSS, to select all elements with the class title-class, we use the selector .title-class as follows:

.title-class {
	background-color: blue;
}

Notice the dot at the beginning of the selector. This dot indicates that we want to select HTML elements with a specific class, in this case, the class title-class. Without the dot, CSS would interpret it as selecting all <title-class> elements, which do not exist.