HTML Classes
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 |