In Association with Amazon.in   Flipkart

Friday, July 5, 2013

CSS Styles With Position(Absolute/Relative/Fixed) Examples

Position

  •     Absolute
  •     Relative
  •     Fixed

Absolute : With absolute positioning, an element can be placed anywhere on a page.

Ex :
<html>
       <head>
              <style>
                     .abc{
                          position:absolute;
                          top     :100;
                          left    :200;
                          }
              </style>
       </head>
       <body>
              <p >  Welcome to Css      </p>
              <p >  Welcome to Css      </p>
              <p class="abc">  Welcome to Css      </p>
             
       </body>
</html>



Relative positioning moves an element relative to its original position.

<html>
          <head>
                   <style>
                             .abc{
                                  position:relative;
                                  top     :100;
                                  left    :200;
                                  }
                   </style>
          </head>
          <body>
                   <p >  Welcome to Css      </p>
                   <p >  Welcome to Css      </p>
                   <p class="abc">  Welcome to Css      </p>
                  
          </body>
</html>

No comments:

Post a Comment


Related Posts Plugin for WordPress, Blogger...