Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • HTML BACKGROUNDS

    • 0
    • 1
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 100
    Comment on it

    Usually any webpage that has been created is with a white background by default unless until we provide some styling to it.like background color,background image,border-,any pattern or transparent backgrounds etc.

    HTML background styling can be provide in any of the ways :-

    a)External style-sheet

    b)Internal style-sheet

    c)Inline style-sheet

    Here's the type of background styling which you can use to make your webpage different from that by default white background.

    1.Background Colors:-

    Background-color is an attribute used to provide color in the background of any of the html elements like table,body,div etc. Color code can be given with color name,color hex value or rgb values and if we want to provide any color with opacity then we use rgba values.

    Syntax:-

      <tagname  style="background-color:color-value;"> /Inline style/
      tagname{background-color:color-value;} /Internal or Externak style/
    

    Example:-

    <!DOCTYPE html>
    <html>
    <head>
        <title>sample</title>
        <style type="text/css">
        body{background-color: pink;}
        table,th,td{background-color: white;}
        </style>
    </head>
       <body>
    <table>
    <caption>info</caption>
        <tr>
                 <th>name</th>
            <th colspan="2">age and qualification</th>
       </tr>
        <tr>
            <td>ayush</td>
            <td>20</td>
            <td>b.com</td>
        </tr>
        <tr>
            <td>bikki</td>
            <td>21</td>
            <td>b.a</td>
        </tr>
        <tr>
            <td>chinky</td>
            <td>22</td>
            <td>b.tech</td>
        </tr>
    </table>
    </body>
    </html>
    

    2.Background-Image:-

    Background-Image is an attribute used to provide an image in the background of any of the html elements like table,body,div etc.

    Syntax:-

      <tagname background-image="Image URL"> /Inline style/
      tagname{background-image:url("Image URL");} /Internal or External style/
    

    Example:-

      <!DOCTYPE html>
        <html>
        <head>
            <title>sample</title>
            <style type="text/css">
            body{background-image: url("image.jpg");}
            table,th,td{background-image: ("white.jpg");}
            </style>
        </head>
           <body>
        <table>
        <caption>info</caption>
            <tr>
                <th>name</th>
                <th colspan="2">age and qualification</th>
               </tr>
              <tr>
            <td>ayush</td>
            <td>20</td>
            <td>b.com</td>
            </tr>
            <tr>
            <td>bikki</td>
            <td>21</td>
            <td>b.a</td>
          </tr>
           <tr>
            <td>chinky</td>
            <td>22</td>
            <td>b.tech</td>
        </tr>
        </table>
        </body>
        </html>
    

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: