HTML "Class" Attribute

1. The HTML class attribute is used to define equal styles for elements with the same class name. So, all HTML elements with the same class attribute will get the same style. Here we have three < div> elements that point to the same class name:

   London

   London is the capital of England.

   Paris

   Paris is the capital of France.

   Tokyo

   Tokyo is the capital of Japan.

    
           < head>
             < style>
             .cities {
               background-color: black;
               color: white;
               margin: 20px;
               padding: 20px;
             }
             < /style>
             < /head>
             < body>
             < div class="cities">
               < h2>London< /h2>
               < p>London is the capital of England.< /p>
             < /div>
             
             < div class="cities">
               < h2>Paris< /h2>
               < p>Paris is the capital of France.< /p>
             < /div>
             
             < div class="cities">
               < h2>Tokyo< /h2>
               < p>Tokyo is the capital of Japan.< /p>
             < /div>
             
             < /body>
           

2. The HTML class attribute can also be used on inline elements:

    
           < head>
             < style>
             span.note {
               font-size: 120%;
               color: red;
             }
             < /style>
             < /head>
             < body>
             < h1>My < span class="note">Important< /span> Heading< /h1>
             < p>This is some < span class="note">important< /span> text.< /p>
             < /body>
           

3. Tip: The class attribute can be used on any HTML element.
   Note: The class name is case sensitive!
   For more