Setting a Background Image in HTML

Any GIF or JPEG image can be used as a background for a Web page, like this one.

Here's the code that sets the background image for this page:

<BODY BACKGROUND="wavetile16gzig.gif">

The <BODY> tag has been expanded to include the BACKGROUND attribute. (For more about tags, attributes, and the basic syntax of HTML, see the Introduction to HTML tutorial.) The BACKGROUND attribute specifies that an image should be loaded into the background of the document. The image itself is a separate file, external to the document. The BACKGROUND attribute merely points to this file.

But as this page may demonstrate, background images can make text hard to read. Use them judiciously.

This particular background image is a GIF, 16 pixels square, with a file size of 3.29 Kb. It looks like this:


Here's the same image, enlarged for detail:


Note that this image is constructed to tile seamlessly.

Here is a sampler of more tiling images.


| Basics of Web Imaging | Tutorials |