HTML class Global Attribute

Description

The global attribute class specifies one or more class names for the element (indicates a class in the style sheet). It can also be used in JavaScript to make changes to HTML elements with the specified class.

To specify several class names for one element, it is necessary to list the class names in order, separated by a space.

Some rules for naming classes:

  • Use only letters of the alphabet (AZ, az), numbers, hyphens, underscores.
  • The name after the period must always begin with a character (wrong: .50cent , .-container ).
  • Case sensitive when naming style classes, as they are sensitive to this and very vulnerable ( .container and .Container are different classes).

Syntax

.classname { ... }

Values

  • classnameA name used to assign to the class. Use only letters of the alphabet (AZ, az), numbers, hyphens, underscores.

Example

<!DOCTYPE html>
<html>
<head>
   <title>Global class attribute</title>
<style> 
.main {
   text-align:center;
   color:red;
}
.index {
   color:blue;
}
</style>
</head>
<body>
   <h1 class="main">The first level heading.</h1>
   <p class="index">A paragraph with an assigned class.</p>
   <p>A paragraph without an assigned class.</p>
</body>
</html>

Browser Support

Desktop
Explorer Edge Chrome Firefox Opera Safari
YesYesYes32YesYes
Tablets / Mobile
Android Chrome Firefox Opera Safari Samsung
YesYes32YesYesYes