html tutorial - class Attribute in HTML - html5 - html code - html form



Class attribute in html

Learn html - html tutorial - Class attribute in html - html examples - html programs

  • The class attribute is used to define the styles for elements with the name of the class.
  • We can define one or more class names for a single element.
  • The class attribute can be used by the style sheet or JavaScript to make changes in HTML elements.
  • The class attribute is a Global Attribute.

Syntax for class attribute in HTML:

<element class="classname">

Difference between HTML 4.01 and HTML 5 for class Attribute:

HTML 4.01

HTML 5

  • In HTML 5 the class attribute supports all HTML elements.

Applies To:

Element Attribute
All HTML elements class

class Attribute Values:

Value Description
classname classname is used to define one or more classes. For specify multiple classes for a single element by using space separated list.

Sample Coding for class Attribute in HTML:

Tryit<!DOCTYPE html>
<html>
    <head>
        <style>
            span.page {
              font-size: 120%;
              color: orange;
              }   
        </style>
    </head>
    <body>
        <h1>My<span class="page">HTML</span>program</h1>
        <p>This is used to create<span class="page">Website</span>design.</p>
    </body>
</html>

Code Explanation for class Attribute in HTML:

class Attribute Code Explanation

  1. span.page is used to define a block of styles for a <span> element which has class name as page.
  2. class attribute is used to set class name for the <span> tag.
  3. page is a name of the class attribute that is used to get the styles for the <span> element.

Output for class Attribute in HTML:

class Attribute Output

  1. The output displays the term HTML and Website in orange color by using class attribute.

Browser Support for class Attribute in HTML:

Yes Yes Yes Yes Yes

Related Searches to class Attribute in html