HTML Classes Tutorial

In HTML, classes are used to group together elements so that they can be styled or manipulated in a similar way. Classes are defined using the class attribute, followed by a name for the class.

Here's an example of how to create a class in HTML:

<p class="my-class">This is a paragraph with the class "my-class".</p>

In the example above, the paragraph element has a class called "my-class". Now let's see how we can style this class using CSS:

.my-class {
    color: blue;
    font-size: 16px;
}

By adding the above CSS code to your stylesheet, all elements with the class "my-class" will have blue text color and a font size of 16 pixels.

Classes can also be used multiple times on different elements:

<div class="section">
    <h2 class="title">Section Title</h2>
    <p class="content">Lorem ipsum dolor sit amet</p>
</div>

In this example, the .section class is applied to a <div> element, while the .title and .content classes are applied to the <h2> and <p> elements, respectively.

Classes are useful for styling different sections of a website, making it easier to apply consistent styles across multiple elements.

Class	Description
header	Applies styles to header elements
footer	Applies styles to footer elements