HTML Background - Images & Codes


An image is worth a thousand words says a Chinese proverb. Images add detail to the web pages and they simplify complex information for the visitors. The technique for adding an image to an html background is quiet simple. There are few commands and codes that one needs to know.

To add background image to an html document, specify it in the tag of the document. If the page does not have a body tag, add one right after the tag. Type the word background in the body tag, keeping one space distance between the two words: .Then add an equal to sign after the word background: Now, specify the location or URL of the image within the inverted commas. If your image is named htmlbackground.jpg and is located at then the new html command will be like this: "” or . This code sets the html background image. It is advisable to use images with .jpg and .gif extensions, as their size is smaller and they are more suitable for animations.

One usually adds an image to the html background and specifies its URL or location. In case that particular image is not available, as a fallback one should always provide the background color to the html document. The background color can be defined with the following command: background-color:#eee; where #eee is the color code.

The HTML background image repeats itself, both horizontally and vertically, to fill the background space, unless otherwise the repetition is defined by the background-repeat command. If you don’t want the image to repeat itself use background-repeat:no-repeat;, to repeat the image horizontally use background-repeat:repeat-x; and to repeat the image vertically use: background-repeat:repeat-y; command.

If the html background is not repeating, it positions itself at the top or left corner of the element. However, the image can be positioned at the desired place by using the position command. For example, to position the image in the center of the HTML document use background-postion:center; and to position the image at the bottom of the HTML document use background-position:bottom; command. By controlling the HTML background color, images and their positioning one can create an eye-catching web page template.

While placing images on the HTML background, never overlook the HTML commands and codes. These special commands and codes form the html source code that creates the web page.

The following links will lead you to few very authentic paid websites that create ready to use HTML templates.