Press "Enter" to skip to content

Class Based CSS Examples in CSS

Last updated on October 5, 2019

Definition :

  • It is a process of applying the css based on the class associated to the component.
  • Classes can be duplicated, clases will be started with dot(.).

Program :

<html>

     <style type=”text/css”>

                    .First

                                {

                                  color:red;

                                }

                                .Second

                                {

                                  background-color: green;

                                }

                </style>

                <body>

                    <p> Hello </p>

                                <p class=”First Second”> HI </p>

                                <p> A </p>

                                <p class=”Second”> B </p>

                                <p> C </p>

                </body>

</html>

Multiple classes based to the css program

Program :

<html>

     <style type=”text/css”>

                    .First, .Third

                                {

                                  color:red;

                                }

                                .Second

                                {

                                  background-color: green;

                                }

                </style>

                <body>

                    <p> Hello </p>

                                <p class=”First Second”> HI </p>

                                <p> A </p>

                                <p class=”Second”> B </p>

                                <p class=”Third”> C </p>

                </body>

</html>

Be First to Comment

    Leave a Reply

    Your email address will not be published. Required fields are marked *