In Association with Amazon.in   Flipkart

Friday, July 5, 2013

CSS Styles With Classes



Classes : There are 3 types of classes.
  1.   Tag name
  2.   User Defined Class
  3.   Id of Tag element  
1. Style Through Tag Name:



Example for Tag Name class:

<html>
     <head>
              <style>
                        p{
                          color:red
                          }
              </style>
     </head>
     <body>
              <p>  Welcome to CSS      </p>
              <b>  Welcome to HTML     </b>
              <p>  Welcome to MSS </p>
     </body>
</html>

2.  Style Through User Defined Class


Example for User Defined class:

<html>
<head>
              <style>
                        .abc{
                                 color:red; font-family:"Courier New"
                                }
                        .bgcol{
                                    background-color:pink; border:dashed
                                  }
              </style>
</head>
     <body>
              <p class="abc">  Welcome to CSS      </p>
              <b class="abc">  Welcome to HTML    </b>
              <p class="bgcol"> Welcome to MSS      </p>
              <p> The End </p>
     </body>
</html>
o/p:---------------------------------------------
Welcome to CSS

Welcome to HTML

Welcome to MSS

The End
  

3. Style Through Tag Id:

Example for id of element:

<html>
     <head>
              <style>
                        #xyz
                          {
                               color:red
                           }
              </style>
</head>
     <body>
              <u id="xyz">  Welcome to CSS      </u>
              <p>           Welcome to HTML        </p>
              <b id="xyz">  Welcome to MSS          </b>
     </body>
</html>

o/p:----------------------------------------------------------------------

Welcome to CSS

Welcome to HTML

Welcome to MSS
 



No comments:

Post a Comment


Related Posts Plugin for WordPress, Blogger...