What are HTML Classes?

Add style and class to your webpage.

The Class Attribute

Classes allow CSS and Javascript to access elements in the DOM. This allows elements to be styled or become dynamic.

With this ‘description’ class, we can style or get data from this element. The class attribute also allows multiple elements using the same class name to be handled in the same way.


In CSS, we can add style or behavior to our element by using the class selector in a style sheet.

.description {
  font-family: Arial;
  color: red;
  font-size: 20px;
  font-weight: bold;
}

That would return:

⚠️ class names are case sensitive

In JavaScript, we can also add color, but we can also make this element with the ‘description’ class dynamic or access its data using the description class name.

Syntax

All classes start with a period. Valid class names start with a letter(a-z)[A-Z] , an underscore(_) , or a hyphen (-).

In HTML, when creating class names, kebab case .kebab-case is the preferred case, but in languages like JavaScript or frameworks like React, camelcase .camelCase is widely used.


Written By: CreationSpacelab

More from CreationSpacelab