What Are HTML Background Codes?

Eugene P.

Background codes for HyperText Markup Language (HTML) are properties of block-level elements that can change the appearance of the area behind the displayed text and images on a web page. By using HTML background codes, the background color of a page can be changed or an image can be defined and displayed as background wallpaper. These codes can be used as a property of the HTML body tag or defined more specifically with cascading style sheets (CSS). While HTML background codes can help to enhance the look of a web page, they also can cause problems with the readability of the page if not tested properly. Additionally, some background codes have been depreciated — specifically the properties of the HTML body tag — and might not be displayed correctly if not defined with CSS properties.

HTML background codes can change the color of a website's background.
HTML background codes can change the color of a website's background.

Both the background property of the HTML body tag and the CSS background-image property allow a designer to specify a file that can be used as the background image of a website. When an image is defined using the body tag’s background property, the image is applied to the background of the entire page. If the background-image CSS property is used, then the image can be confined to a single block-level element, such as a table or textbox. The image can be nearly anything, although most browsers will not display graphic interchange format (gif) animations as a background image and instead might only show the first frame.

Tweaking with a website's HTML background codes can affect readability.
Tweaking with a website's HTML background codes can affect readability.

Other background codes can be used with the body tag and additional CSS properties. They allow an image to be defined as repeating throughout the background vertically, horizontally or both. The HTML background codes also can be used to align an image to a specific area of the screen, such as the bottom right corner. The CSS properties can accept percentages or pixel locations as arguments, providing a method for positioning images in very specific locations.

There also is a simpler set of HTML background codes that deal with defining a solid color as the background for a website. Just like with images, applying the color inside the body tag will change the background color of the entire page, while changing the CSS body properties will restrict the change to a single block-level element. It is important to note that some web browsers allow users to disable the display of background images and colors.

HTML background codes can sometimes be displayed improperly or disabled, so it is considered poor design practice to rely heavily on the color of a background image to relay vital information to the viewer of the website. Similarly, if the color of the text and background are inverted and the background is not displayed correctly, then viewers of the website could see no text at all. Maintaining a dark text color over a light background can help to make a website visible even if the background is not shown in the desired color.

You might also Like

Discuss this Article

Post your comments
Forgot password?