CSS Backgrounds Example




CSS Backgrounds Example

<!DOCTYPE HTML>
<html>
   <head>
      <style>
         h3,p{  
            background-color: lightblue;  
         }  
      </style>  
   </head>  
   <body>  
      <h3>This is first CSS page.</h3>  
      <p>Hello Tutorial Root. This is an example of CSS background-color.  
      <h1>CSS First Example</h1>
      <p>This is paragraph.</p>
   </body>
</html>

Output

Background Image

<!DOCTYPE HTML>
<html>
   <head>
      <style>
         body {
            background-image: url("paper.gif");
         }
      </style>
   </head>
   <body>
      <h1>Hello World!</h1>
      <p>This page has an image as the background!</p>
  </body>
</html>

Output

Repeat Background Image

<!DOCTYPE HTML>
<html>
   <head>
      <style>
         body {
            background-image: url("images/css.jpg");
            background-repeat: repeat;
         }
      </style>
   </head>
   <body>
      <p>CSS Tutorials</p>
      <p>This page has an Repeat Background Image</p>
   </body>
</html>

Output

Background Image Position

<!DOCTYPE HTML>
<html>
   <head>
      <style>
         body {
            background-image: url("images/norept-back.jpg");
            background-position:100px;
         }
      </style>
   </head>
   <body>
      <p>CSS Tutorials</>
   </body>
</html>

Output