CSS Class Selector

When you are styling your html document, sometimes you need to apply same style to more than one element. For this purpose, in CSS we use class selector. Class selectors use dot notation, and simple example using class selector would look like:

.red_font {
   color: red;
}

Now, we have red_font class, which will make text closed to this class element red.
To explain it better, imagine html structure like this:

<p>Lorem ipsum dolor sit amet, consectetur <span>Important text</span> adipiscing elit. Recordatio lucerna hac equitas arcus requietum <span>Important text</span> par perdignus ita. He tamen qualis turba, precipuus praeclarus exuro labefacto, cui punitor ex lascivio hae <span>Important text</span> falcis traho.</p>

We want to make all the important text in span elements red. Using three span elements of our red_font class defined above will do the job.

.red_font {
   color: red;
}

<p>Lorem ipsum dolor sit amet, consectetur <span class="red_font">Important text</span> adipiscing elit. Recordatio lucerna hac equitas arcus requietum <span class="red_font">Important text</span> par perdignus ita. He tamen qualis turba, precipuus praeclarus exuro labefacto, cui punitor ex lascivio hae <span="red-font">Important text</span> falcis traho.</p>

I am sure, you got the point. To sum up, we use class selectors in case we need to apply same rules on more than one element (its not unique).