Sunday 15 October 2017

Of course, your site page foundation is white in shading. You dislike it, but rather no stresses. HTML gives you following two great approaches to enliven your website page foundation.


  • HTML Background with Colors 
  • HTML Background with Images 


Presently how about we see both the methodologies one by one utilizing proper cases.

Html Background with Colors 

The bgcolor credit is utilized to control the foundation of a HTML component, particularly page body and table foundations.

Note − The bgcolor characteristic expostulated in HTML5. Try not to utilize this property.

Following is the linguistic structure to utilize bgcolor trait with any HTML tag.

<tagname bgcolor = "color_value"...>

This color_value can be given in any of the accompanying organizations −

<!-- Format 1 - Use color name -->
<table bgcolor = "lime" >
 
<!-- Format 2 - Use hex value -->
<table bgcolor = "#f1f1f1" >
 
<!-- Format 3 - Use color value in RGB terms -->
<table bgcolor = "rgb(0,0,120)" >

Illustration 

Here are the cases to set foundation of a HTML tag −

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Background Colors</title>
   </head>
 
   <body>
      <!-- Format 1 - Use color name -->
      <table bgcolor = "yellow" width = "100%">
         <tr>
            <td>
               This background is yellow
            </td>
         </tr>
      </table>
 
      <!-- Format 2 - Use hex value -->
      <table bgcolor = "#6666FF" width = "100%">
         <tr>
            <td>
               This background is sky blue
            </td>
         </tr>
      </table>
 
      <!-- Format 3 - Use color value in RGB terms -->
      <table bgcolor = "rgb(255,0,255)" width = "100%">
         <tr>
            <td>
               This background is green
            </td>
         </tr>
      </table>
   </body>
   
</html>

Html Background with Images 

The foundation quality can likewise be utilized to control the foundation of a HTML component, particularly page body and table foundations. You can indicate a picture to set foundation of your HTML page or table.

Note − The foundation characteristic censured in HTML5. Try not to utilize this quality.

Following is the punctuation to utilize foundation quality with any HTML tag.

Note − The foundation property is deplored and it is prescribed to utilize Style Sheet for foundation setting.

<tagname background = "Image URL"...>

The most as often as possible utilized picture positions are JPEG, GIF and PNG pictures.

Case 

Here are the cases to set foundation pictures of a table.

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Background Images</title>
   </head>
 
   <body>
      <!-- Set table background -->
      <table background = "/images/html.gif" width = "100%" height = "100">
         <tr><td>
            This background is filled up with HTML image.
         </td></tr>
      </table>
   </body>
   
</html>
Designed and Transparent Backgrounds 

You may have seen many example or straightforward foundations on different sites. This just can be accomplished by utilizing designed picture or straightforward picture out of sight.

It is proposed that while making designs or straightforward GIF or PNG pictures, utilize the littlest measurements conceivable even as little as 1x1 to keep away from moderate stacking.

Case 

Here are the cases to set foundation example of a table −

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Background Images</title>
   </head>
 
   <body>
      <!-- Set a table background using pattern -->
      <table background = "/images/pattern1.gif" width = "100%" height = "100">
         <tr>
            <td>
               This background is filled up with a pattern image.
            </td>
         </tr>
      </table>

      <!-- Another example on table background using pattern -->
      <table background = "/images/pattern2.gif" width = "100%" height = "100">
         <tr>
            <td>
               This background is filled up with a pattern image.
            </td>
         </tr>
      </table>
   </body>
   
</html>


0 comments:

Translate

GoogleTech786. Powered by Blogger.

Subscribe Youtube

Our Facebook Page

Wikipedia

Search results

Popular Posts

Adsense