HTML Classes

HTML Classes are used to identify multiple elements in your web page. HTML classes will allow you to reference the element when you need to add some style to it. Take a look at the following example:

<div class="box"></div>

Next, if we wanted to reference the element using CSS we can use the . symbol followed by the name of the class like so:

.box{
    width:200px;
    height:200px;
    background:blue;
    margin-left:10px;
    float:left;
}

If we added the HTML and CSS to a webpage we would end up with the following result:

HTML Class Example

Since we are using a class instead of an ID, we can use a class as much as we would like in our page.

<div class="box"></div>
<div class="box"></div>
<div class="box"></div>

If we were to add the code above to an HTML page we would end up with the following result:

HTML Multiple Class Example

Using classes allows us to have multiple elements with the same style and/or functionality.