lesson1Title

lesson2Title

lesson3Title

lesson4Title

lesson5Title

lesson6Title

lesson7Title

lesson8Title

lesson9Title

lesson10Title

webIntroHtmlChapter3Title

lesson11Title

lesson12Title

webIntroHtmlChapter1Title

webIntroHtmlChapter2Title

webIntroHtmlChapter4Title

# Class

An HTML `class` is an **identifier** used to apply common styles and behaviors to various HTML elements on a webpage.

By using the same `class` name for multiple elements, you can style those elements in the same way.

For example, if you want to display all warning message texts in red on a webpage, you can define a shared CSS class for warning messages as follows.

A `class` can be defined using a `.` followed by the class name.

```css title="Defining alert class in CSS"
/* Define the alert class */
.alert {
 color: red;
}
```

```html title="Applying alert class in HTML"
Warning message 1
Warning message 2
```

All HTML elements with the `alert` class applied will have their text color changed to red.

A single HTML element can have multiple `class`es.

Each `class` is separated by a space, and the styles and behaviors from all the classes will be applied to the HTML element.

```html title="Applying multiple classes in HTML"
Large warning message
```

By leveraging HTML `class`es in this way, you can effectively and consistently apply styles and behaviors to various HTML elements on your webpage.

An HTML element can have multiple classes at the same time. Each class is separated by a space, and the styles and behaviors of all the classes are applied to that HTML element.

### An HTML element can only have one class.