HTML Classes and Access from CSS

HTML classes are used to group same elements.
Any changes of the class affect the entire elements in the class

How to define a class :


  <h3 class="Fruits">Apple</h3>
  <h3>Dog</h3>
  <h3 class="Fruits">Banana</h3>
  <h3>Cat</h3>
         

Using class attribute, we can specify the class name and add elements into it.

How the changes in class affects the its elements

Specifications of a class written insite the style tags



    <style>
    .Fruits{
    background-color: green;
                  }
               </style>


         Result:

        
         

Multiple Classes :

An element can have multiple classes.
Another class defined by giving a space.


         Example:

            <h3 class="Fruits Organic">Apple</h3>
            <h3>Dog</h3>
            <h3 class="Fruits">Banana</h3>
            <h3>Cat</h3>

         

Let's look how the multiple classes works :


         Example:

               <style>
                  .Fruits{
                     background-color: green;
                  }

                  .Organic{
                     color: white;

                  }
               </style>


         Result: